Truffle 手册:使用指南

在Truffle中使用MetaMask

在浏览器中与智能合约交互之前,确保已经编译、部署了合约,并且使用客户端js中的web3 对象访问区块链。我们建议使用truffle-contract库,这个库可以简化与合约的交互,并且 非常稳定。

现在我们来尝试MetaMask。

MetaMask是什么

MetaMask是在浏览器中访问DAPP的最简单的方法,它是Chrome或Firefox浏览器的扩展,可以 接入以太坊网络而无需在浏览器所在的机器上运行一个全节点。它可以接入以太坊主网、 测试网(Ropsten、Kovan、Rinkeby等)或者一个本地区块链,例如Ganache或Truffle Develop 创建的开发区块链。 对于使用Truffle的开发者而言,这意味着我们可以让普通用户以同样的方式访问我们的DAPP。

安装MetaMask

要安装Chrome的MetaMask插件,请前往Chrome Web Store 然后点击[Add to Chrome]按钮。

要安装Firefox的MetaMask插件,请前往Firefox Add-ons 页面然后点击[Add to Firefox]按钮。

使用MetaMask访问Ganache

Ganache是一个用于测试的图形化区块链模拟器, 它运行在地址127.0.0.1:7545.

注意:我们建议指定127.0.0.1而非localhost因为该地址不需要网络连接,因此更适合开发环境。

在继续下一步之前,我们需要确保dapp检查MetaMask的web3实例。MetaMask会注入它 自己的web3实例,因此我们在浏览器页面载入后执行下面的检查:

// Is there is an injected web3 instance?
if (typeof web3 !== 'undefined') {
  App.web3Provider = web3.currentProvider;
  web3 = new Web3(web3.currentProvider);
} else {
  // If no injected web3 instance is detected, fallback to Ganache.
  App.web3Provider = new web3.providers.HttpProvider('http://127.0.0.1:7545');
  web3 = new Web3(App.web3Provider);
}

配置MetaMask

要在MetaMask中使用Ganache,点击浏览器中的MetaMask图标,将弹出以下窗口:

点击Import with seed phrase,在弹出的文本框中输入Ganache显示的助记词: 输入密码,然后点击OK。

现在我们需要将MetaMask连接到Ganache创建的区块链。点击菜单中的Main Network 然后选择Custom RPC: 在输入框中输入 http://127.0.0.1:7545,然后点击Save

顶部的网络名称将切换到Private Network。点击顶部右侧的叉关闭页面返回账户页。

现在已经将MetaMask连接到了Ganache,每个账户都有100 ether。第一个账号 的余额可能会少一点,因为可能之前使用这个账户来部署了智能合约。

点击顶部左侧的account图标创建新的账户: 在输入框中输入 http://127.0.0.1:7545,然后点击Save

顶部的网络名称将切换到Private Network。点击顶部右侧的叉关闭页面返回账户页。

现在已经将MetaMask连接到了Ganache,每个账户都有100 ether。第一个账号 的余额可能会少一点,因为可能之前使用这个账户来部署了智能合约。

点击顶部左侧的account图标创建新的账户:

在Truffle中使用MetaMask

Truffle Develop是一个命令行应用,它启动一个临时区块链,可以用于测试,运行在地址127.0.0.1:9545。

Truffle Develop的使用非常类似于Ganache,唯一的区别在于Truffle Develop默认运行在 127.0.0.1:9545,因此我们将修改上面的Web3代码:

// Is there is an injected web3 instance?
if (typeof web3 !== 'undefined') {
  App.web3Provider = web3.currentProvider;
  web3 = new Web3(web3.currentProvider);
} else {
  // If no injected web3 instance is detected, fallback to Truffle Develop.
  App.web3Provider = new web3.providers.HttpProvider('http://127.0.0.1:9545');
  web3 = new Web3(App.web3Provider);
}

同时配置MetaMask,使其连接到 http://127.0.0.1:9545。

在MetaMask中访问Ganache-cli

在MetaMask中连接Ganache CLI和连接Ganache非常类似,唯一的区别是Ganache CLI默认监听 地址为 http://127.0.0.1:8545 ,因此需要相应地调整代码:

// Is there is an injected web3 instance?
if (typeof web3 !== 'undefined') {
  App.web3Provider = web3.currentProvider;
  web3 = new Web3(web3.currentProvider);
} else {
  // If no injected web3 instance is detected, fallback to Ganache CLI.
  App.web3Provider = new web3.providers.HttpProvider('http://127.0.0.1:8545');
  web3 = new Web3(App.web3Provider);
}

在MetaMask中,配置连接URL为 http://127.0.0.1:8545.

全部评论(0)
给作者留言