Gift history
Please access after login.


Wait a moment...

ブラウザ環境でのSymbolの実行環境の構築について

506
2
2020-11-06 10:18:58
0.00 mXYM
(0)

この記事では、ブラウザ環境でSymbolの機能を使える方法を紹介します。

また、本編に入る前の前置きでSymbol documentationを読んでいきますので、以下の記事を読んで全体的な概要を知ると頭に入りやすいかと思います。

Symbol Documentationについて

【前置き】Symbol SDKはサーバーで使うもの

Symbolの機能を使うには、Symbol SDKを使えばまとまった開発ができます。
ここで、SDKとは「Software Developper Kit」の略称で、開発に必要なプログラムをひとまとめにしたパッケージです。現在(2020年11月1日現在)はサーバー向けのJavascript、Typescript、JAVAが提供されています。
また、Symbolはオープンソースなので、どんな言語でもSDKに移植することができます。


そのSymbol SDKは、Node.jsの仕組みを使って作動させています。Node.jsはJavascriptをサーバーで動かす仕組みとなるものです。

本来、Javascriptはクライアント側(自分たち側)で動かす言語であり、サーバーで動かす言語ではありませんが、Node.jsを使う事で、Javascriptがサーバーでも使えるようになります。

また、Symbol SDKのJavascript版を利用するには、Node.jsバージョン10以上のインストールが必要のようです。

 

以上の写真で掲載したページは、以下のURLに記載されています。

https://github.com/nemtech/symbol-sdk-typescript-javascript

 

 

なので、Symbol SDKを使う一番最初の手順はサーバー環境を構築してから以下のようにします。

・Node.js公式サイトからNode.jsをインストールする(これは必須)

https://nodejs.org/ja/

 

プロジェクト用フォルダを作成し、

その中にSymbol SDKとrxjsをインストールします。

npm install symbol-sdk rxjs

 

このようにサーバー環境で構築となると、それなりの専門知識が必要になりますし、Symbolの機能を使う事が難しくなります。
ではどうすればいいのかをここで紹介します。

 

【本編】ブラウザ環境でSymbolの機能を使えるようにする

ブラウザ環境でSymbolの機能を使えるようにするには、browserifyを用いてまとめたファイルをダウンロードすることで、ブラウザ環境でもSymbol SDKを使えるようになります。このまとめたファイルをバンドルファイルといいます。なお、このファイルを使う際は、Node.jsをインストールする必要はありません。
 これは、takanobuさん(https://twitter.com/xembook)がGitHUBにて以下のページにてまとめてくれています。

https://github.com/xembook/nem2-browserify

 

このページから最新版をダウンロードすることになります。

2020年11月1日現在の最新版は「symbol-sdk-0.21.0.js」なので、それをクリックします。

今後、最新版が出ると思いますので、それをダウンロードしてください。

 

クリックすると・・・

 

「Download」をクリックすると、ソースコードが表示されます。

 

このソースコードをダウンロードしてください。

ここで、右クリックすると、ダウンロードすることができます。

拡張子が.jsでのダウンロードができない場合は、ダウンロード後に.jsに拡張子を変更することも可能です。

 

 

ダウンロードしたら、適用したいファイルとSymbol SDKを同じフォルダに入れることで、Symbol SDKを使えるようになります。適用するファイルはHTMLファイルであったりします。

 

 

このようにダウンロードしてローカル環境でも使えるSDKを使うのもいいですが、HTMLの中に以下のように記述することでSymbol SDKを使う事もできます。

<script src="https://xembook.github.io/nem2-browserify/symbol-sdk-0.21.0.js"></script>

そうすることで、ネットワーク上からSDKを読み込んで使うことができます。

バンドルファイルは自作可能

Symbol SDKをブラウザ環境で使えるバンドルファイルの作成はtakanobuさんがしてくれていますが、自分で作成することもできます。その方法は、以下の本の86ページと87ページに掲載されているので、そちらで確認をしてください。

 

次世代NEMではじめるブロックチェーンアプリケーション開発

この本は、BOOTHにて販売中です!!
(https://nizveyl.booth.pm/items/1549217)

 

Writer
NEMのユートピアを目指してるYUTOです!! nemlogでは、イベント情報のまとめ記事や、記事の感想記事を中心に書いています。 nemlogがユートピアになるように、着々と計画中です!! また、NEM HUBもしています。 https://community.nem.io/signup/jxWxyOo3ff/

Login required to post comment
Loading...
https://symbol-sakura-16.next-web-technology.com:3001,https://symbol.harvest-monitor.com:3001,https://hideyoshi-node.net:3001,https://harvest-01.symbol.farm:3001,https://criptian-xym-node.net:3001,https://35665.xym.stir-hosyu.com:3001,https://yuna.keshet.finance:3001,https://keshet01-symbol-paradise.com:3001,https://keshet03-symbol-paradise.com:3001,https://keshet04-symbol-paradise.com:3001,https://cryptocat-xym-node.com:3001,https://misaki-xym.com:3001,https://ik1-305-12844.vs.sakura.ne.jp:3001,https://17107.xym.stir-hosyu.com:3001,https://23639.xym.stir-hosyu.com:3001,https://sym-main-01.opening-line.jp:3001,https://sym-main-02.opening-line.jp:3001,https://sym-main-03.opening-line.jp:3001,https://sym-main-04.opening-line.jp:3001,https://sym-main-05.opening-line.jp:3001,https://sym-main-06.opening-line.jp:3001,https://sym-main-07.opening-line.jp:3001,https://sym-main-08.opening-line.jp:3001,https://sym-main-09.opening-line.jp:3001,https://sym-main-10.opening-line.jp:3001,https://symbol-node-01.kokichi.tokyo:3001,https://50038.xym.stir-hosyu.com:3001,https://27423.xym.stir-hosyu.com:3001,https://angel.vistiel-arch.jp:3001,https://xym.stakeme.tokyo:3001,https://00-symbol-node.yagiyoshi.com:3001,
6BED913FA20223F8,051FAEC15105C808,73019335A785A3AE,5289A9B0DBB7EB25,6B245EAF1302E444,2C4A4893229DD0A9,