十一课堂|经过小游戏学习Ethereum DApps编程（6）

时间 2019-11-10

标签十一课堂经过游戏学习 ethereum dapps 编程栏目游戏繁體版

原文原文链接

在前面的系列文章中咱们了解了ERC20 tokens以及ERC721标准，和crypto-collectible。这些知识可让咱们能够和其余玩家交易本身的创造的角色。javascript

在最后一篇咱们将了解怎么把智能合约发不到ETH网络上。咱们会了解一些关于Web3.js库的知识点。html

1 客户端和node之间的通讯机制

一个客户端向ETH网络发出请求的时候，咱们的客户端须要告诉nodejava

咱们须要的智能合约的地址node
咱们须要哪一个功能jquery
和那个功能须要的参数git

ETH网络的node只可以识别：JSON-RPC语言，对于人类来讲不是那么容易阅读。github

在实际中，客户端向node发出的请求是这样的web

// Yeah... Good luck writing all your function calls this way!

// Scroll right ==>

{"jsonrpc":"2.0","method":"eth_sendTransaction","params":[{"from":"0xb60e8dd61c5d32be8058bb8eb970870f07233155","to":"0xd46e8dd67c5d32be8058bb8eb970870f07244567","gas":"0x76c0","gasPrice":"0x9184e72a000","value":"0x9184e72a","data":"0xd46e8dd67c5d32be8d46e8dd67c5d32be8058bb8eb970870f072445675058bb8eb970870f072445675"}],"id":1}

而经过Web3.js库来进行通信的话，就能够把上面的晦涩难懂的部分包装到盒子里面。而表面上，咱们可使用易懂的语言。ajax

咱们能够这样写：npm

CryptoZombies.methods.createRandomZombie("Vitalik Nakamoto ") .send({ from: "0xb60e8dd61c5d32be8058bb8eb970870f07233155", gas: "3000000" })

2 安装Web3.js库

// Using NPM

npm install web3

// Using Yarn

yarn add web3

// Using Bower

bower install web3

// ...etc.

你也能够直接下载最小化了的js文件：github（https://github.com/ethereum/web3.js/blob/1.0/dist/web3.min.js）

而后import到你到文件里面。

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

咱们的html文件会是这个样子：

<!DOCTYPE html><html

 lang="en">

  <head>

    <meta charset="UTF-8">

    <title>CryptoZombies front-end</title>

    <script language="javascript" type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

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

  </head>

  <body>

  </body>

</html>

3 设置Web3 Provider

ETH网络上，有很成千上万的node，经过设置Web3 Provider，咱们能够设置咱们将对哪一个特定的node发出请求。固然你须要本身建立一个node，来作provider。

若是说这些特别的设置，会让不少人困惑，固然ETH社区已经为你准备好了一个工具：Infura

Infura

Infura是一个附带有缓存，高速处理读写的node。

Infura is a service that maintains a set of Ethereum nodes with a caching layer for fast reads, which you can access for free through their API. Using Infura as a provider, you can reliably send and receive messages to/from the Ethereum blockchain without needing to set up and maintain your own node.

能够这样设置Infura为你的Web3 Provider

var web3 = new Web3(new Web3.providers.WebsocketProvider("wss://mainnet.infura.io/ws"));

public，private key

区块链上，别人不可能冒名顶替你，是由于别人不知道你的private key。可是一个智能合约在执行的时候，咱们须要用户用private key来签名，从而证实此次调用，是咱们在调用。咱们既然知道private key的重要性，固然不敢轻易的来管理用户的private key了。

因此，在用Infure的功能的基础上，若是想要加上private key的管理的功能的话，Chrome和firefox的extension：Metamask将是一个必备的工具。

Metamask uses Infura's servers under the hood as a web3 provider, just like we did above — but it also gives the user the option to choose their own web3 provider. So by using Metamask's web3 provider, you're giving the user a choice, and it's one less thing you have to worry about in your app.

若是安装了Metamask，也就意味这你装备了Web3.js。

下面这段代码是Metamask提供的，怎么检测是否Metamask已经安装：

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

  // Checking if Web3 has been injected by the browser (Mist/MetaMask)

  if (typeof web3 !== 'undefined') {

    // Use Mist/MetaMask's provider

    web3js = new Web3(web3.currentProvider);

  } else {

    // Handle the case where the user doesn't have web3\. Probably

     // show them a message telling them to install Metamask in

     // order to use our app.

  } 

 // Now you can start your app & access web3js freely:

  startApp()

})

4 ABI

ABI stands for Application Binary Interface。

表明了智能合约函数的JSON形式。Solidity编辑器会告诉咱们的ABI。

5 发布

在编辑，发布了你的智能合约以后，咱们须要记下下面的内容：

记下咱们智能合约在ETH网络上地地址。好比电子猫的地址：0x06012c8cf97BEaD5deAe237070F9587f8E7A266d
还有上面ABI。

6 初始化智能合约

// Instantiate myContract

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

Web3.js

咱们会经过Web3.js提供的两个接口来和Web3.js进行交互：call 和 send call is used for view and pure functions. It only runs on the local node, and won't create a transaction on the blockchain.

还记得：view and pure么？表示这个函数不会对区块链进行写的操做，只会读取，并且彻底是免费的。

Web3.js的call用于激活任何view or pure的函数。

咱们能够这样激活Web3.js的call

myContract.methods.myMethod(123).call()

send will create a transaction and change data on the blockchain. You'll need to use send for any functions that aren't view or pure.

Web3.js的call用于激活任何非view or pure的函数。并且须要用户支付费用

和call同样，你能够这样激活

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

拓展阅读：

十一课堂|经过小游戏学习Ethereum DApps编程（1）

十一课堂|经过小游戏学习Ethereum DApps编程（2）

十一课堂|经过小游戏学习Ethereum DApps编程（3）