仮想通貨アンテナ

仮想通貨 ブロックチェーン情報

イーサリアム ブロックチェーン

クリプトゾンビ チャプター 14: Web3.js 覚書memo

更新日:

クリプトゾンビ cryptoZombies

イーサリウムでゲームを構築する方法が学べる無料オープンソーススクール クリプトゾンビ(cryptoZombies) チャプター 14: Web3.js学習時の覚書(memo)です。

Web3.js

web3.jsは、JavascriptがHTTP、IPC、またはWebSocketを使用してローカルまたはリモートのイーサリアムノードとやり取りできるライブラリです。

<script language="javascript" type="text/javascript" src="web3.min.js"></script>
<script language="javascript" type="text/javascript" src="web3.js"></script>
var cryptoZombies;

      function startApp() {
        var cryptoZombiesAddress = "YOUR_CONTRACT_ADDRESS";
        cryptoZombies = new web3js.eth.Contract(cryptoZombiesABI, cryptoZombiesAddress);
      }

Web3プロバイダのノードと通信(関数call)

これは非同期通信

cryptoZombies.methods.zombies(id).call() 

Web3.jsを使って123をパラメーターにする。

myMethodという名の関数を呼び出すトランザクションをsend

myContract.methods.myMethod(123).send()

Metamaskの使用

MetamaskはChromeとFirefoxのブラウザ拡張機能。
ユーザーのイーサリアム・アカウントと秘密鍵を安全に管理。
そのアカウントでWeb3.jsを使用しているウェブサイトとやりとりする

ユーザーがMetamaskをインストール済みかを検出

インストールしていなければMetamaskのインストールが必要だと伝える

window.addEventListener('load', function() {

  // Web3がブラウザにインジェクトされているかチェック (Mist/MetaMask)
  if (typeof web3 !== 'undefined') {
    // Mist/MetaMaskのプロバイダの使用
    web3js = new Web3(web3.currentProvider);
  } else {
    // ユーザーがweb3を持たない場合の対処。
    // アプリを使用するためにMetamaskをインストールするよう
    // 伝えるメッセージを表示。
  }

  // アプリのスタート&Web3.jsへの自由なアクセスが可能に:
  startApp()

})

コントラクトABI

Web3.jsがコントラクトにアクセスするために ABI が必要。

ABIとは、Application Binary Interfaceの略。
これはコントラクトのメソッドをJSON形式で表している。

(関数コールをコントラクトが理解できるにフォーマットする方法をWeb3.jsに提供。)

コントラクトをコンパイルする際、SolidityコンパイラがABIを提供

コントラクトアドレスとABIをコピーして保存する必要あり。

コントラクトをデプロイするとコントラクトアドレスが決定。

Web3.jsコントラクトのインスタンス化

// myContractをインスタンス化

var myContract = new web3js.eth.Contract(myABI, myContractAddress);

チャプター 14: Web3.js サンプルコード

// これがコントラクトにアクセスする方法だ:
var abi = /* abi generated by the compiler */
var ZombieFactoryContract = web3.eth.contract(abi)
var contractAddress = /* our contract address on Ethereum after deploying */
var ZombieFactory = ZombieFactoryContract.at(contractAddress)
// `ZombieFactory`はコントラクトのpublic関数とイベントにアクセスできるようになったぞ。

// 入力テキストを取得する類のイベントのリスナーだ:
$("#ourButton").click(function(e) {
  var name = $("#nameInput").val()
  // `createRandomZombie`関数を呼び出す部分だ:
  ZombieFactory.createRandomZombie(name)
})

// `NewZombie`イベントをリッスンしてUIを更新する部分だ
var event = ZombieFactory.NewZombie(function(error, result) {
  if (error) return
  generateZombie(result.zombieId, result.name, result.dna)
})

// ゾンビのdnaを取得して画像を更新する部分だ
function generateZombie(id, name, dna) {
  let dnaStr = String(dna)
  // 16桁未満の場合はDNAの先頭に0をつける部分だ
  while (dnaStr.length < 16)
    dnaStr = "0" + dnaStr

  let zombieDetails = {
    // 最初の2桁は頭の部分だ。頭部は7種類用意してあるから、%7して
    // 0から6の番号を取得したら、そこに1を足して1から7にするのだ。
    // これを基にして、"head1.png" から"head7.png"までの
    // 画像ファイルを用意する部分だ:
    headChoice: dnaStr.substring(0, 2) % 7 + 1,
    // 次の2桁は目の部分だ。11種類用意してあるぞ:
    eyeChoice: dnaStr.substring(2, 4) % 11 + 1,
    // シャツの部分は6種類用意してある:
    shirtChoice: dnaStr.substring(4, 6) % 6 + 1,
    // 最後の6桁は色の部分だ。 CSSのフィルタを使用して更新できる。
    // 360度の色相回転(hue-rotate)を使うぞ:
    skinColorChoice: parseInt(dnaStr.substring(6, 8) / 100 * 360),
    eyeColorChoice: parseInt(dnaStr.substring(8, 10) / 100 * 360),
    clothesColorChoice: parseInt(dnaStr.substring(10, 12) / 100 * 360),
    zombieName: name,
    zombieDescription: "A Level 1 CryptoZombie",
  }
  return zombieDetails
}

チャプター 15: Web3.js サンプルコード

var abi = /* abi generated by the compiler */
var ZombieFeedingContract = web3.eth.contract(abi)
var contractAddress = /* our contract address on Ethereum after deploying */
var ZombieFeeding = ZombieFeedingContract.at(contractAddress)

// ゾンビのIDと捕食したい子猫のIDをすでに持っているものとする。
let zombieId = 1;
let kittyId = 1;

// クリプトキティの画像を取得するにはweb APIに照会する必要がある。
// この情報はブロックチェーンにはない。ウェブサーバーにあるだけだ。
// もし全ての情報がブロックチェーン上に格納されていれば、サーバーの
// 障害を心配することはなくなるがな。まぁこのゾンビゲームを気に入ってもらえなければ、
// APIを変更するか我々のアクセスをブロックするだけだ。問題ない ;)
let apiUrl = "https://api.cryptokitties.co/kitties/" + kittyId
$.get(apiUrl, function(data) {
  let imgUrl = data.image_url
  // 画像を表示する部分だ
})

// ユーザーが子猫をクリックししたときの処理だ:
$(".kittyImage").click(function(e) {
  // コントラクトの`feedOnKitty` メソッドを呼び出す
  ZombieFeeding.feedOnKitty(zombieId, kittyId)
})

// コントラクトのNewZombieイベントをリッスンして表示できるようにする部分だ: 
ZombieFactory.NewZombie(function(error, result) {
  if (error) return
  // この関数はレッスン1でやったのと同じようにゾンビを表示するものだ:
  generateZombie(result.zombieId, result.name, result.dna)
})

ビットコインってなに?

2008年11月、metzdowd.comにナカモトサトシにより投稿された論文Bitcoin:A Peer-to-Peer Electronic Cash Systemで定義された仕様とをもとにビットコイン・コミュニティーで開発が続けられる製造と取引に暗号学を使った通貨のことです。

ビットコイン自体は、フリー・ソフトウエアで、ソフトウェア開発のプラットフォームGitHubに登録すれば、ソースやドキュメント閲覧が可能で、開発に参加も可能です。

ナカモトサトシは、2010年12月まで開発に携わっていましたが、その後姿を消しました。日本名ですが、国籍も含め匿名性が高く身元も不明です。

真偽のほどは、不明ですがSBI社長の北尾氏が、2018年3月期第2四半期 SBIホールディングス(株)決算説明会動画の1:29:20頃)でナカモトサトシと議論を交わしたと発言して話題になりました。

ビットコインの仕組み

ビットコインは、P2P型の公開型分散台帳技術(DLT)によって信頼性を担保され運用されるブロックチェーンで結合された暗号通貨(cryptocurrency)のことです。

ビットコインは、P2Pネットワーク上のサーバー上で同一取引情報を持ちコントロールすることで取引の妥当性のチェックが行われるため、銀行など、特定の管理者がいない非中央集権型の仮想通貨と呼ばれています。

ブロックチェーン


GitHub

ブロックチェーンの動き

マイニング

ビットコインは送信アドレス(Tx)に対するデジタル署名によって保護されており、一定時間(10分)ごとに、すべての取引記録を分散台帳に追加します。

その追加処理には、ネットワーク上の分散取引台帳データと、10分間に発生したすべての取引のデータの整合性を取りながら正確に記録することが必要です。

整合性を取る作業は、膨大な計算量が必要となるため専用のハードウエアの計算能力を使って、誰でもが取引を処理することができます。

この手伝いをしてくれた人(膨大な計算処理を行った人)の中で、結果として追記処理を成功させた人には、その見返りとしてビットコインが支払われます。

この作業をマイニングと呼びます。

マイニングには、ソロマイニングとプールマイニングがあり、個人のPCでも余った演算能力でプールマイニングに参加できます。

ジェネシス・マイニングでのハッシュパワー購入

ジェネシス・マイニングは世界最大の高く信頼されたビットコイン クラウド マイニングのプロバイダーです。ハッシュパワー購入時に,コード(kjx2uz)を使用した人は、購入時に3%の割引になります。

ブロックチェーンエクスプローラー

ブロックチェーンアドレスを入力することで、送金状況(confirmation回数の確認)が行えます。

ブロックチェーンエクスプローラー

ブロックチェーンエクスプローラー(chainFlyer)

ビットコイン価格とチャート表示

-イーサリアム, ブロックチェーン

Copyright© 仮想通貨アンテナ , 2020 All Rights Reserved.