Blockchain code Metaverse VR

SmartContract×VR×Crypto(607)

スポンサーリンク

//tips

//smart contract

Jqueryでのループを用いたコントラクト情報の表示を確認した。画像表示は後日next.jsでトライする

function displayZombies(ids) {
$("#zombies").empty();
for (id of ids) {
// Look up zombie details from our contract. Returns a `zombie` object
getZombieDetails(id)
.then(function(zombie) {
// Using ES6's "template literals" to inject variables into the HTML.
// Append each one to our #zombies div
$("#zombies").append(`<div class="zombie">
<ul>
<li>Name: ${zombie.name}</li>
<li>DNA: ${zombie.dna}</li>
<li>Level: ${zombie.level}</li>
<li>Wins: ${zombie.winCount}</li>
<li>Losses: ${zombie.lossCount}</li>
<li>Ready Time: ${zombie.readyTime}</li>
</ul>
</div>`);
});
}
}

ここまではページ表示をcallによりコントラクトから取得した情報で行えた。次にスマートコントラクト上のデータを変更するためのsendを使用する。

このsendの実行にはガスがかかり、metamaskがsendで送るトランザクションの署名のためにポップアップする。

このsendをしてからブロックチェーンに反映されるのには時間がかかり、これが一般的に小売で仮想通貨決済が使えない要因の一つとなっている。ちなみに、イーサリアムのブロック生成時間は平均15秒。このため非同期処理が必要となる。

逆にいうと読み込みや照合などには時間がかからないのでQRコードなどの読み取り照合(家のスマート鍵)などには使えるのかも。

自身のゾンビを生成する関数をページから実行させる。つまり、Metamask接合したwebインスタンス(web3.js)からこの関数を呼び出す。

function createRandomZombie(name) {
// しばらく時間がかかるので、UIを更新してユーザーに
// トランザクションが送信されたことを知らせる
$("#txStatus").text("Creating new zombie on the blockchain. This may take a while...");

// トランザクションをコントラクトに送信する:
return cryptoZombies.methods.createRandomZombie(name)
.send({ from: userAccount })
.on("receipt", function(receipt) {

$("#txStatus").text("Successfully created " + name + "!");

// トランザクションがブロックチェーンに取り込まれた。UIをアップデートしよう
getZombiesByOwner(userAccount).then(displayZombies);
})
.on("error", function(error) {
// トランザクションが失敗したことをユーザーに通知するために何かを行う
$("#txStatus").text(error);
});
}

receiptは、トランザクションがEthereumのブロックに含まれると発行されるもの、errorの際にはユーザーにその旨を通知する。

sendを呼び出す場合、オプションでgasとgasPriceを指定するが現バージョンではgasは21,000あたりが推奨されていたように思われる。send({ from: userAccount, gas: }))

Payable関数を実行する際にはEtherではなくweiで指定する必要がある。1 etherには10^18 wei。

0を自分でつけるとミスを引き起こすので、ここでは、utils.toWeiを使用することでwei表記に直す。web3js.utils.toWei("1", "ether”);を使用していく。

cryptoZombies.methods.levelUp(zombieId)
.send({ from: userAccount, value: web3js.utils.toWei("0.001", "ether") })

これを適用した関数は下記のようになる。

function levelUp(zombieId) {
$("#txStatus").text("Leveling up your zombie...");
return cryptoZombies.methods.levelUp(zombieId)
.send({ from: userAccount, value: web3js.utils.toWei("0.001", "ether") })
.on("receipt", function(receipt) {
$("#txStatus").text("Power overwhelming! Zombie successfully leveled up");
})
.on("error", function(error) {
$("#txStatus").text(error);
});
}

イベントの扱いについても確認する。

イベントにより都度フロントエンド通知を取得する。

zombiefactory.solの中にevent NewZombie(uint zombieId, string name, uint dna);があったと思うがこのようなイベントが実行された際に、その通知を取得することができる。

このイベントをユーザごとにフィルタリングするためにはTransferイベントのようなindexedが必要となる。

event Transfer(address indexed _from, address indexed _to, uint256 _tokenId);

getPastEventsを使って過去のイベントや、fromBlock・toBlockを使用して、期間を指定してログを取ることも可能とのこと。

これを利用して、条件をつけた必要な情報のみをガスを節約する形で取得できる。

cryptoZombies.getPastEvents("NewZombie", { fromBlock: 0, toBlock: "latest" })
.then(function(events) {
// `events`は、上でやったように反復可能な`event`配列内のオブジェクトである
// このコードは、これまで生成された全ゾンビのリストを提供してくれる
});

データを保存する代わりに、このイベントで一気にデータを取得してしまう方が安上がりとなる。memoryでわざとループさせて情報を得たのと同じ要領となる。

イベントでのループはコントラクト内では使えず、アプリのように切り離されたフロントエンドで使用可能になるテクニック。

Vitalikパイセンだと思うけど、How to Build an Oracleがクリプトゾンビの章の中にしれっとあって神だと思った。

人気の記事

1

コロナによる需要変化 コロナパンデミックの影響で、人々は外に出られなくなり、自宅で過ごす時間が増えました。 この自粛ムードの中、下記のようなビジネスの需要変化が引き起こされています。 【利用者減少】 ...

2

米国レストランの決済時に毎日お世話になっていた「Square」のビジネスモデルについて本日はふれていきたいと思います。 「Square」とは、ネットにつながったモバイル端末と専用のカードリーダーを用意 ...

3

無料でネットショップを開けるアプリとして多くの人に驚きを与えたBASE株式会社が、2019年10月25日東証マザーズに上場しました。2020年2月時点で90万店を超えるショップを抱えるまでに成長してい ...

4

2011年にサービスを開始してから圧倒的な成長率を誇るインテリア通販サイト 【FLYMEe/フライミー】を皆さんご存じでしょうか。 「自分のイメージするインテリア、本当に欲しいインテリアがどこにあるの ...

5

ナイキのSNKRSが、なぜこれほどまでに人気なのか?調べてみました。 きっかけは米国での友達との会話。彼は自分のシューズをみせて、「これ20万円もしたんだぜ。」と語ってくれました。 あまり靴に興味がな ...

-Blockchain, code, Metaverse, VR
-, ,

Copyright© BUSINESS HUNTER , 2022 All Rights Reserved Powered by AFFINGER5.