255-cryptozombies全攻略七

最新推荐文章于 2022-07-01 07:06:19 发布

Lich Howger

最新推荐文章于 2022-07-01 07:06:19 发布

阅读量181

点赞数

分类专栏： solidity CryptoZombies全攻略

本文链接：https://blog.csdn.net/qq_33781658/article/details/87475198

版权

solidity 同时被 2 个专栏收录

34 篇文章 5 订阅

订阅专栏

CryptoZombies全攻略

8 篇文章 6 订阅

订阅专栏








cryptozombies全攻略七








第一章.Web3.js
什么是Web3.js
以太坊网络是由节点组成的
每个节点都包含了区块链的一份拷贝
当我们想要调用一份智能合约的一个方法
需要从其中一个节点中查找并告诉它
1.智能合约的地址
2.想调用的方法
3.想传入的参数

以太坊只能识别一种叫做JSON-RPC的语言
这种语言不好懂
Web3.js把查询语句都隐藏起来了
我们只需要和JavaScript界面进行交互就可以了

我们可以在github上面下载一个web3.min.js
https://github.com/ethereum/web3.js/blob/1.0/dist/web3.min.js

然后我们把web3.js添加到script标签里面
<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>











第二章.web3.js
web3 provider
以太坊是由同一份数据的相同拷贝的节点构成的
在web3.js里设置web3的provider告诉我们的代码
应该和哪个节点交互来处理我们的读写
这就好像在传统的web应用程序中为API调用设置远程的web服务器网址
我们可以用一个第三方的服务Infura

Infura
Infura维护了很多以太坊节点并
提供了一个缓存层来实现高速读取
可以用他们的API来访问这个服务

var web3 = new Web3(new Web3.providers.WebsocketProvider("wss://mainnet.infura.io/ws"));
这样可以把Infura作为web3节点提供者

Metamask是浏览器扩展,能让用户安全地维护以太坊账户和私钥
并用用户的账户和使用web3.js的网站互动

我们可以使用一段样板代码,
检查用户是否安装以及告诉用户安装Metamask

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

  // 检查web3是否已经注入到(Mist/MetaMask)
  if (typeof web3 !== 'undefined') {
    // 使用 Mist/MetaMask 的提供者
    web3js = new Web3(web3.currentProvider);
  } else {
    // 处理用户没安装的情况， 比如显示一个消息
    // 告诉他们要安装 MetaMask 来使用我们的应用
  }

  // 现在你可以启动你的应用并自由访问 Web3.js:
  startApp()

})










第三章.与合约对话
现在我们已经用Metamask的web3提供者初始化了web3.js
接下来我们用它来和我们的智能合约对话
web3.js需要两个东西来与合约对话
1.地址
2.abi

合约地址
写完了智能合约之后,需要编译然后部署到以太坊
部署智能合约之后,它将获得一个以太坊上的永久地址
我们需要在部署后复制这个地址来和智能合约进行对话

合约ABI
另一个web3.js与合约对话需要的东西是ABI
ABI
Application Binary Interface
应用二进制接口
基本上,它是以JSON格式表示合约的方法
告诉web3.js如何以合同理解的方式格式化函数调用

当编译完合约向以太坊上部署的时候
solidity编译器会给一个ABI
所以我们要保存地址和ABI

实例化web3.js
var myContract = new web3js.eth.Contract(myABI, myContractAddress);











第四章.调用合约函数
web3.js有两个方法来调用合约的函数call,send

call
call用来调用view和pure函数
只运行在本地节点,不会在区块链上创建事务
view和pure函数是只读的,并不会改变区块链的状态
也不消耗任何gas
用户不会要求用MetaMask对事务签名

send
send将创建一个事务改变区块链上的数据
需要用send来调用非view,pure的函数
send一个事务需要用户支付gas,
并且需要用户使用MetaMask对事务进行签名

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

获取数据
之前我们把僵尸数组写成了这样
Zombie[] public zombies;
在solidity里面,当定义一个public变量的时候
它将自动定义一个公开的getter同名方法
比如要查看一个id为15的僵尸
那么就可以zombies(15)

写一个方法,传入id,查询僵尸
function getZombieDetails(id) {
  return cryptoZombies.methods.zombies(id).call()
}

getZombieDetails(15)
.then(function(result) {
  console.log("Zombie 15: " + JSON.stringify(result));
});


cryptoZombies.methods.zombies(id).call()
会和web3提供者节点进行通信
告诉它返回合约中的id为id的zombie

这是异步的,就像从服务器调用API
所以web3在这里返回了一个promises

一旦promise被resolve,
就会执行then中的代码,在控制台打出result

Lich Howger

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
255-cryptozombies全攻略七

cryptozombies全攻略七第一章.Web3.js什么是Web3.js以太坊网络是由节点组成的每个节点都包含了区块链的一份拷贝当我们想要调用一份智能合约的一个方法需要从其中一个节点中查找并告诉它1.智能合约的地址2.想调用的方法3.想传入的参数以太坊只能识别一种叫做JSON-RPC的语言这种语言不好懂Web3.js把查询语句都隐藏起来...
复制链接

扫一扫