![](https://i0.wp.com/matsushin11.com/wp-content/uploads/2018/07/computer_school_boy.png?w=728&ssl=1)
![](https://i0.wp.com/matsushin11.com/wp-content/uploads/2017/10/matsushin.png?w=728&ssl=1)
完了したトランザクションを監視する仕組みを実装すればできますよ!ライブラリを利用した実際のコードを見せましょう!!
前回はNEM Libraryを用いて独自通貨(モザイク)を送金するコードを実装しました。
今回は着金の監視になります。
もう少し説明しますと、XEMあるいはモザイクを送金・着金した際に発行されるトランザクションの監視です。
監視ができるようになりますと例えば着金時にメールの通知をする等の送金、着金をトリガーとして何かしらの処理を行うことができるようになります。
ではコードを見ていきましょう!
完了したトランザクション監視の実装方法
NEM LibraryのListner機能を使っていきます。
1 2 3 4 5 6 7 8 9 10 11 12 13 |
import {Address, ConfirmedTransactionListener, NEMLibrary, NetworkTypes} from "nem-library"; NEMLibrary.bootstrap(NetworkTypes.TEST_NET); // TestNetへの接続 const address = new Address("監視対象のアドレスを入れてください"); const confirmedTransactionListener = new ConfirmedTransactionListener([ { domain: '23.228.67.85' }, ]).given(address); confirmedTransactionListener.subscribe(x => { console.log(x); }, err => { console.log(err); }); |
たったこれだけ!!
ちなみに監視できるのは完了したトランザクションだけではありません。
トランザクションが発行されたタイミングでの情報(UnconfirmedTransactionListener)やアカウント情報(AccountListener)を監視することもできます。詳しくはこちらのドキュメントが参考になるかと思います。
それでは、また前回同様Vue.jsを用いてサンプルアプリを作っていますので動作を見ていきましょう。
ただしFirebaseを利用して動作確認できるようにしましたので、コードを取得してセットアップする必要はありません。
今回実装したコードはこちらにおいています。
サンプルコードを動作させる
開発環境
- Mac OS High Sierra v10.13.5
- node v10.0.0
- yarn v1.6.0
- vue v2.5.17
- typescript v3.0.0
- new-library v1.1.0-RC1
画面で動作確認
NEMのトランザクション発行の監視するようにできたのでfirebaseにデプロイしといた。
テストネットのアドレスかつwebsocketがhttp通信のため通常アクセスできないので、URL 表示欄の右端にあるマークをクリックしてスクリプトの許可をする必要あり。https://t.co/g8INEX0wPt$XEM #NEM— まつしん@Railsプログラマ (@matsushin11)
Firebase上にデプロイして動作確認できるようにしているためそちらで動作を見ていきます。
まずはこちらのURLにアクセスして画面が表示されたら監視したいアドレスを入力して「トランザクションの監視を開始する」を押す。
![nem-library-listner-vue-sample.jpg Nem library listner vue sample](https://i0.wp.com/matsushin11.com/wp-content/uploads/2018/09/nem-library-listner-vue-sample.jpg?resize=465%2C150&ssl=1)
画面ではトランザクション監視中となっていますが、実はまだ監視できていません。Consoleを見ますと、「Opening Web Socket…」が繰り返し出力されているはずです。Web Socketが接続できていない状態となっています。
![nem-library-listner-vue-sample.jpg Nem library listner vue sample](https://i1.wp.com/matsushin11.com/wp-content/uploads/2018/09/nem-library-listner-vue-sample-1.jpg?w=620&ssl=1)
URLの右端のアイコンをクリックして、「安全でないスクリプトを読み込む」をクリック。
※ セキュリティ的に安全でないことをすることになるので、今回は特別に実行します。
![nem-library-listner-vue-sample.jpg Nem library listner vue sample](https://i1.wp.com/matsushin11.com/wp-content/uploads/2018/09/nem-library-listner-vue-sample-2.jpg?resize=438%2C50&ssl=1)
再度監視したいアドレスを入力。するとConsoleの出力が変わったかと思います。
これで監視の準備ができました。
![nem-library-listner-vue-sample.jpg Nem library listner vue sample](https://i1.wp.com/matsushin11.com/wp-content/uploads/2018/09/nem-library-listner-vue-sample-3.jpg?w=620&ssl=1)
NanoWalletから監視対象のアドレスにXEMを送金してみます。
![Send_a_transaction_—_Nano_Wallet.jpg Send a transaction Nano Wallet](https://i0.wp.com/matsushin11.com/wp-content/uploads/2018/09/eff6eb5f99eead2c80595cc95fe6f523.jpg?resize=523%2C314&ssl=1)
しばらくすると送金処理が完了します。
完了したタイミングで画面上が下記のようにトランザクションの内容が表示されればOK!
quantityが50000となっていますが、これは0.5XEM送金したことを表しています。
もちろん着金だけでなく、送金した場合もトランザクションの監視ができます。
トランザクション情報の内容としては signer 情報の中のアドレスは送金実施アドレスで recipient 情報の中のアドレスが送金対象アドレスとなっています。
ここを確認すれば指定のアドレスが送金したのか、着金したのかを判断できそうです。
![nem-library-listner-vue-sample.jpg Nem library listner vue sample](https://i0.wp.com/matsushin11.com/wp-content/uploads/2018/09/nem-library-listner-vue-sample-6.jpg?w=660&ssl=1)
まとめ
![luke-chesser-48-unsplash.jpg Luke chesser 48 unsplash](https://i1.wp.com/matsushin11.com/wp-content/uploads/2018/09/luke-chesser-48-unsplash.jpg?resize=600%2C400&ssl=1)
今回はNEM Libraryを用いてトランザクションの監視を行いました。
XEMやモザイクの送金同様にトランザクションの監視も簡単に実現ができました。
次に着金時にデスクトップ通知させるのにも挑戦してみたいなと思います。
というのも最近nemlogがリリースされXEMの投げ銭が活発化されてきました。投げ銭してもらった際にメール通知も良いのですが、デスクトップ通知で知らせがあるとより気付きやすくなり楽しさが増すのではないかという狙いです。
実現可能かは良くわかりませんが、Chrome Extensionを作ればできるのかな?となんとなく考えているところです。
独自通貨(モザイク)の送金の実装方法は分かった!!そうすると次は着金したらメール通知するみたいなことできないかなー?