760d

实现区块链,以太坊区块链使⽤web3开发⾃⼰第⼀个

DApp

摘要:在学习了最基础的⼀些以太坊知秋天的怀念答案 识以及开发框架搭建完成之后，可以尝试开发⾃⼰的第⼀个DApp，此处使⽤Truffle开发框

架，Remix编译环境，Genache测试客户端，具体操作如下

在学习了最基础的⼀些以太坊知识以及开发框架搭建完成之后，可以尝试开发⾃⼰的第⼀个DApp，此处使⽤Truffle开发框架，Remix编译

环境，Genache测试客户端，具体操作如下。

此处参照MetaCoin创建⾃⼰的模拟转账Dapp名称为RuoliCoin

1、创建⼯作⽬录

创建RuoliCoin⽬录，在此⽬录下打开命令⾏执⾏Truffle初始化命令，如下：truffleunboxwebpack

即可创建基础Truffle框架。

2、创建Solidity智能合约⽂件

在RuoliCoin/contracts⽬录下删除原有的、两个⽂件，新建⽂件，使⽤Web版本的Remix

打开此⽂件，进⾏智能合约的编写操作，最后编写好的智能合约内容如下：pragmasolidity^0.4.23;

contractRuoliCoin{

mapping(address=>uint)balances;eventTransfer(addressindexed_from,addressindexed_to,uint256_value);constructor()

balances[]=10000;

}functionndCoin(addressreceiver,uintamount)publicreturns(bools燃香 ufficient){if(balances[]

balances[]-=amount;

balances[receiver]+=amount;emitTransfer(,receiver,amount);returntrue;

}functiongetBalance(addressaddr)publicviewreturns(uint){returnbalances[addr];

}

}

3、部署⾄测试环境

修改⽂件，指定本地RCPServer地址(启动Ganache后主界⾯有显⽰)，内容如下：s={

networks:{

development:{

host:'localhost',

port:'7545',

network_id:'*'//Matchanynetworkid

}

}

};

migrations⽬录下1_initial_、2_deploy_两个⽂件⾮常重要切勿删除，在此⽬录下

将2_deploy_进⾏修改内容如下：

varRuoliCoin=e("./");s=function(deployer){

(RuoliCoin);

};

在RuoliCoin⽬录下使⽤命令⾏编译并部署智能合约⽂件，如下：PSC:WorkspaceRuoli-CodeTruffleRuoliCoin>trufflecompile

PSC:WorkspaceRuoli-CodeTruffleRuoliCoin>truffledeploy

Usingnetwork'development'.

Runningmigration:1_initial_

...0x73e55a0f780c6780039abc3feb8b5e96e441668e8ab55579e51db

Migrations:

...

Runningmigration:2_deploy_

...0xd4c85531d5d83c61f79485c43e6e4146d51b909c8b73bf5d88b60aa990cf1d08

RuoliCoin:

...

PSC:WorkspaceRuoli-CodeTruffleRuoliCoin>

此时查看Ganache界⾯中第⼀个账户的ETH余额已减少，说明部署成功。

4、编写页⾯⽂件

在app⽬录下删除所有⽂件，新建、javascripts/两个⽂件，⽂件内容如下：

如下：html>

RuoliCoin-TruffleDemo

转账

重置

余额查询

javascripts/内容如下：//导⼊CSS//import"../stylesheets/";//导⼊web3和truffle-contract库

import{defaultasWeb3}from'web3';import{defaultascontract}挨挨挤挤 from'truffle-contract'//导⼊Hello合约的ABI⽂件

importRuoliCoin_artifactsfrom'../../build/contracts/'//获取Hello合约对象

varRuoliCoinContract=contract(RuoliCoin_artifacts);varruoliCoinInstance=null;varaccounts;varaccount;={

init:function(){//设置web3连接文静的近义词

vider(tProvider);//Getthein南京城 itialaccountbalancesoitcanbedisplayed.

ounts(function(err,accs){if(err!=null){

alert("Therewasanerrorfetchingyouraccounts.");return;

}if(==0){

alert("Couldn'tgetanyaccounts!MakesureyourEthereumclientisconfiguredcorrectly.");r七夕民俗 eturn;

}

accounts=accs;

account=accounts[0];

});

//instance为Hello合约部署实例

ed().then(function(instance){

ruoliCoinInstance=instance;varevent=er();

(function(error,result){

alert(error);(result);

});

}).catch(function(e){(e,null);

});

},//封装合约中的say()⽅法调⽤过程，供javascript调⽤

transfer:function(transferAddr,amount,callback){//调⽤Hello合约中的say()⽅法，并传⼊参数name

in(transferAddr,amount,{from:account}).then(function(result){//将返回结果传⼊回调函数

callback(null,result);

});

},

getBalance:function(balanceAddr,callback){//调⽤Hello合约中的say()⽅法，并传⼊参数name

(balanceAddr,{from:account}).then(function(result){//将返回结果传⼊回调函数

callback(null,result);

});

}

3=newWeb3(ovider("127.0.0.1:7545"));

();

});

运⾏界⾯如下：

5、运⾏与测试

在RuoliCoin根⽬录执⾏启动命令npmrundev，如下：PSC:WorkspaceRuoli-CodeTruffleMetacoin>npmrundev

>truffle-init-webpack@0.0.2devC:WorkspaceRuoli-CodeTruffleMetacoin

>webpack-dev-rver

AstSizeChunksChunkNames

1.68MB0[emitted][big]main

925bytes[emitted]

chunk{0}(main)1.66MB[ent除夕诗句大全 ry][rendered]

[71]./app/javascripts/3.64kB{0}[built]

[73]./build/contracts/47.8肺大泡形成的原因 kB{0}[built]

[111].不由自主造句 /~/loglevel/lib/7.86kB{0}[built]

[117]./~/querystring-es3/127bytes{0}[built]

[119]./~/strip-ansi/161bytes{0}[built]

[122]./app/stylesheets/905bytes{0}[built]

[163]./~/truffle-contract/2.64kB{0}[built]

[197]./~/url/23.3kB{0}[built]

[199]./~/web3/193bytes{0}[built]

[233](webpack)-dev-rver/client/3.67kB{0}[built]

[234]典故成语故事 (webpack)-dev-rver/client/1.08kB{0}[built]

[235](webpack)/hotnonrecursive^.log$160bytes{0}[built]

[236](webpack)/hot/77bytes{0}[built]

+223hiddenmoduleswebpack:Compiledsuccessfully.

即可访问到页⾯，输⼊转⼊地址和⾦额即可进⾏代币转账操作，输⼊查询余额地址即可进⾏查询余额操作。