EthDapp-Boilerplate
这个项目是一个最小的,只面向前端的去中心化应用程序(Dapp)。它的特点是一个使用传统web技术与以太坊区块链上的智能合约接口的网站。

 

使用dapp
确保你使用的是谷歌Chrome(最新版本)
打开Chrome Web Store (https://chrome.google.com/webstore/category/extensions),并安装免费的MetaMask扩展,为您提供一个网关到以太坊区块链。尽管要小心,骗子经常发布假冒的MetaMask版本,想要偷你的钱!现在我们不需要太费神,因为我们玩的是假钱。
打开MetaMask扩展(Chrome现在应该在浏览器的右上角显示?),并按照屏幕上的说明设置MetaMask
单击MetaMask窗口的左上角,选择Ropsten测试网。以太在这个测试网不是真正的钱,你可以得到他们免费!
更改为Ropsten测试网后,单击“购买”按钮,然后单击“Ropsten测试网水龙头”按钮。
现在应该打开https://faucet.metamask。io /你可以点击请求1醚从水龙头,几分钟后你应该收到你Ropsten testnet醚现在你可以假钱转给其他帐户或使用它来支付交易费(气)写作时在Ethereum智能合同区块链。
编写自己的智能合约
打开https://remix.ethereum.org并单击左上角的+按钮创建一个新文件,命名为例如HelloWorld.sol。
在新创建的文件中,编写智能合约代码,或更改此存储库中提供的示例。
提示:官方的solid文档可以在https://solidity.readthedocs.io/找到。

为了在本地测试你的智能合约,而不需要将它部署到“真正的”区块链上,你可以在浏览器沙箱中测试运行它。为此,在Run上单击右上角,在Environment下选择Javascript VM。现在,您可以点击红色的Deploy按钮,查看触发智能合约所有功能的函数调用的按钮。
一旦您准备好将智能合约部署到Ropsten测试网,请从运行>Environment中选择注入web3(如果没有列出,则可能没有安装MetaMask),然后再次单击deploy。现在,你应该收到一个MetaMask弹出,要求你签署交易,并通过点击Submit广播它(如果这不能工作,请确保你有一些Ropsten Ether在你的余额,而不仅仅是零余额)。
几分钟后,智能合约就会出现在区块链上。
集成智能合约
如果希望将web应用程序与自己的智能合约连接起来,需要两样东西:智能合约地址和智能合约的ABI。你可以从《混音》中获得这两种。
智能合约地址:在成功地将智能合约部署到Ropsten测试网之后,智能合约实例出现在remix中,它的名称右侧有一个小的复制按钮,您可以通过它复制地址,它以0x….开头用智能合约的地址替换custom.js文件中的变量contractAddress。
提示:地址必须在引号中(“0xabc123…”),否则你会得到奇怪的错误。

智能合约ABI:智能合约的ABI也可以在Compile选项卡下的Remix中找到,然后选择Details并向下滚动到ABI部分,再次按下复制按钮。用值替换变量contractAbi。
提示:ABI是JSON格式,不应该加引号,否则会再次出现奇怪的错误。

问题:如果您更改了合同,ABI和地址都需要更新,否则又会出现奇怪的错误。

Gotacha2:如果更改了函数名和参数,还需要通过contractInstance更改javascript接口。getGreeting contractInstance.setGreeting。

EthDapp-Boilerplate

This project is a minimal, frontend-only decentralized application (Dapp). It features a website using traditional web technologies interfacing a smart contract on the Ethereum blockchain.

Now your dapp probably told you

I doesn’t has web3 🙁

because it cannot connect to the Ethereum blockchain yet. Time to change that:

Using the dapp

  1. Make sure you are using Google Chrome (latest version)
  2. Open the Chrome Web Store (https://chrome.google.com/webstore/category/extensions) and install the free MetaMask extension that provides you a gateway to the Ethereum blockchain. Beware though, scammers are regularly publishing fake MetaMask version that want to steal your money! For now we dont bother too much as we’re playing with fake money anyway.
  3. Open the MetaMask extension (Chrome should now show a ?in the top right corner of your browser) and setup MetaMask following the on-screen instructions
  4. Click in the top left corner of the MetaMask window to select the Ropsten testnet. Ether on this testnet are not real money and you can get them for free!
  5. After changing to the Ropsten testnet click on the BUY button and then on the ROPSTEN TESTNET FAUCET button.
  6. This should now open https://faucet.metamask.io/ where you can click on request 1 ether from faucet, after a few minutes you should receive you Ropsten testnet Ether and now you can transfer this fake money on to other accounts or use it to pay for the transaction fee (gas) when writing to the smart contract on the Ethereum blockchain.

Write your own smart contract

  1. Open https://remix.ethereum.org and click on the + button in the top left corner to create a new file, name it e.g. HelloWorld.sol.
  2. In the newly created file, code your smart contract, or change the example provided in this repository.

Hint: The official Solidity documentation can be found at https://solidity.readthedocs.io/.

  1. For testing your smart contract locally and without deploying it to a “real” blockchain you can test run it in a browser-sandbox. To do so click in the top right corner on Run and under Environment select Javascript VM. Now you can hit the red Deploy button and see buttons that trigger function calls for all functions of your smart contract.
  2. Once you are ready to deploy your smart contract to the Ropsten testnet select injected web3 (if this is not listed you might not have MetaMask installed) from Run>Environment and again hit Deploy. Now you should receive a MetaMask popup that asks you to sign the transaction and broadcast it by clicking on Submit (if this does not work make sure you have some Ropsten Ether on your balance and not just a balance of zero).
  3. After a few minutes the smart contract should appear on the blockchain.

Integrating your smart contract

  1. If you want to interface the web application with your own smart contract, it needs two things: the smart contract address and the ABI of the smart contract. You can take both from Remix.
  2. Smart contract address: after successfully deploying a smart contract to the Ropsten testnet, the smart contract instance appears in remix, it has a little copy button on the right of its name with which you can copy the address, it starts with 0x.... Replace the variable contractAddress in the file custom.js with the address of your smart contract.

Hint: the address has to be in quotes ("0xabc123...") otherwise you’ll get weird errors.

  1. Smart contract ABI: the ABI of the smart contract can also be found in Remix under the Compile tab, then select Details and scroll down to the ABI section and again press the copy button. Replace the variable contractAbi with the value.

Hint: The ABI is a JSON format and should NOT be in quotes, otherwise again weird error.

Gotcha: The ABI and the address need to be both updated if you change the contract, otherwise again weird error.

Gotacha2: If you changed function names and parameters, you need to also change the javascript interfacing via contractInstance.getGreeting and contractInstance.setGreeting.

区块链毕设网(www.interchains.cc)全网最靠谱的原创区块链毕设代做网站 部分资料来自网络,侵权联系删除! 最全最大的区块链源码站 ! QQ3039046426
区块链知识分享网, 以太坊dapp资源网, 区块链教程, fabric教程下载, 区块链书籍下载, 区块链资料下载, 区块链视频教程下载, 区块链基础教程, 区块链入门教程, 区块链资源 » EthDapp-Boilerplate

提供最优质的资源集合

立即查看 了解详情