More than 3 years have passed since last update.

コピペで動作するScatterウォレットEOSプログラミング

Posted at 2020-05-12

仮想通貨EOSのウォレットScatter（スキャッター）を操作するプログラムサンプルが難解なものが多かったので明記しました。

詳細についてはEOS専門サイトEOSERSにも掲載しています。
EOSERS.com

#eosjsとScatterモジュールの読み込み

まずはHTMLのヘッダーにeosjsとScatterモジュールを読み込みます。

scatter.html


<!-- EOS基盤のJavascriptモジュール v16.0.9 -->
<script src="https://cdn.jsdelivr.net/npm/eosjs@16.0.9/lib/eos.min.js"></script>

<!-- ScatterのコアJavascriptモジュール -->
<script src="https://cdn.scattercdn.com/file/scatter-cdn/js/latest/scatterjs-core.min.js"></script>

<!-- ScatterのEOSブロックチェーン接続Javascriptモジュール -->
<script src="https://cdn.scattercdn.com/file/scatter-cdn/js/latest/scatterjs-plugin-eosjs.min.js"></script>

これを設定することによるEOSとScatterのAPIからブロックチェーンに接続し送金やステーキング、アカウント作成などの様々なEOSの機能を扱うことが出来ます。

#パラメーターを初期化

まずはパラメーターを一度初期化します

scatter.html


/*Scatterを初期化する*/
ScatterJS.plugins(new ScatterEOS());

/*EOS API変数を初期化する*/
var eos = null;

/*アカウント情報を初期化する*/
var account = null;

/*パーミッション情報を初期化する*/
var options = null;

#ネットワークを設定する

ブロックチェーンに接続するためにネットワーク情報を設定します。

scatter.html


/*EOSメインネットのチェーン設定*/
const network = ScatterJS.Network.fromJson({
    blockchain:'eos',
    chainId:'aca376f206b8fc25a6ed44dbdc66547c36c6c33e3a119ffbeaef943642f0e906',
    host:'nodes.get-scatter.com',
    port:443,
    protocol:'https'
});

テスト版で動かしたい場合はテストネットも接続できます。

scatter.html


/*EOSテストネットJungleのチェーン設定*/
const network = ScatterJS.Network.fromJson({
    blockchain: 'eos',
    chainId: 'e70aaab8997e1dfce58fbfac80cbbb8fecec7b99cf982a9444273cbc64c41473',
    host: 'jungle2.cryptolions.io',
    port: 443,
    protocol: 'https'
});

#Scatterにログインする

scatter.html


function scatter_login(){

    /* ScatterでEOSブロックチェーンに接続する */
    ScatterJS.connect('YourAppName', {network}).then(connected => {
        /* 接続ができなかった場合は処理を中止する */
        if(!connected) return console.error('no scatter');

        /* EOSブロックチェーンとScatterを繋ぎAPI操作できるようにする。 */
        eos = ScatterJS.eos(network, Eos);

        /* ScatterでEOSブロックチェーンに接続する */
        ScatterJS.login().then(id => {

            /* ScatterでEOSアカウントに不備があれば処理を中止する */
            if(!id) return console.error('no identity');

            /* Scatterに登録されているEOSアカウントのパラメーターを設定する */
            account = ScatterJS.account('eos');
            /* activeかownerかのパラメーターを設定する */
            options = {authorization:[`${account.name}@${account.authority}`]};

            /* 設定されたアカウント情報を出力する */
            console.log(JSON.stringify(account));
            
        });
    });
}

#Scatterからログアウトする

scatter.htm


function scatter_logout(){

    /* Scatter上のアカウントデータをクリアする */
    ScatterJS.scatter.forgetIdentity()

    /* Scatterからログアウトする。 */
    ScatterJS.scatter.logout();

    /* アカウント情報をクリアする */
    account = null;
    option = null;

}

#フルコード

scatter.htm


<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>scatter test</title>


<script src="https://cdn.jsdelivr.net/npm/eosjs@16.0.9/lib/eos.min.js"></script>
<script src="https://cdn.scattercdn.com/file/scatter-cdn/js/latest/scatterjs-core.min.js"></script>
<script src="https://cdn.scattercdn.com/file/scatter-cdn/js/latest/scatterjs-plugin-eosjs.min.js"></script>
  
<script>

/* EOSとScatterの初期化をする */
ScatterJS.plugins(new ScatterEOS());
var eos = null;
var account = null;
var options = null;


/* EOSブロックチェーンネットワークを宣言する */
const network = ScatterJS.Network.fromJson({
    blockchain:'eos',
    chainId:'aca376f206b8fc25a6ed44dbdc66547c36c6c33e3a119ffbeaef943642f0e906',
    host:'nodes.get-scatter.com',
    port:443,
    protocol:'https'
}); //mainnet


/* Scatterにログインする。 */
function scatter_login(){
    ScatterJS.connect('<dAppsの名称>', {network}).then(connected => {
        if(!connected) return console.error('no scatter');

       eos = ScatterJS.eos(network, Eos);

        ScatterJS.login().then(id => {
            if(!id) return console.error('no identity');
        
            account = ScatterJS.account('eos');
            options = {authorization:[`${account.name}@${account.authority}`]};

            /* HTML上に結果を表示する。 */
            document.getElementById('account').innerHTML = JSON.stringify(account);
            
        });
    });
}

/* Scatterにログアウトする。 */
function scatter_logout(){
    ScatterJS.scatter.forgetIdentity()
    ScatterJS.scatter.logout();
    account = null;
    options = null;
    
    document.getElementById('account').innerHTML = "no account";
}

</script>
</head>

<body>

<!-- HTMLの本文 -->
<h1>scatter test</h1>

<!-- Scatterのログインとログアウトをするボタン -->
<button type="button" name="name" value="value" onClick="scatter_login();">Scatter Login</button><br>
<button type="button" name="name" value="value" onClick="scatter_logout();">Scatter Loｇout</button><br><br>

<!-- 結果を表示する -->
<div id="account">no account</div><br>

</body>
</html>

#まとめ
Scatter接続プログラムによって様々なコンテンツ作成を可能にし、今後イーサリアムに匹敵するコンテンツ増も見込めると予想しています。

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up