電子發(fā)燒友App
POA Network是一個基于以太坊的平臺，為智能合約提供開源框架。POA Network是使用權(quán)威證明作為其共識機制的以太坊的側(cè)鏈。POA為開發(fā)人員提供了在以太坊標準中編碼的靈活性，以及POA Network解決方案在區(qū)塊鏈網(wǎng)絡中的可擴展性和互操作性的額外優(yōu)勢。
POA的交易費用與以太坊主網(wǎng)一樣，但與以太網(wǎng)支付費用的以太坊主網(wǎng)相比，PoA區(qū)塊鏈需要native貨幣（稱為PoA代幣）支付費用，該代幣可在Binance等加密交易平臺上獲得。
POA目前有兩個網(wǎng)絡正在運行：
· POA Core：需要POA令牌的主網(wǎng)絡
· POA Sokol：需要POA Sokol令牌的測試網(wǎng)絡
出于本教程的目的，我們將使用POA Sokol網(wǎng)絡。
步驟1：將Metamask連接到PoA Sokol并為您的帳戶提供資金
在第一步中，我們將學習如何將我們的metamask錢包連接到一個名為sokol的POA測試網(wǎng)絡，以及如何使用測試POA令牌為帳戶提供資金。
1、解鎖Metamask擴展程序
2、轉(zhuǎn)到“設置”，輸入以下新的RPC URL https://sokol.poa.network并單擊“保存”
注意：也可以使用POA的專用瀏覽器擴展（僅限Chrome），與Metamask非常相似：Nifty
3、在Metamask中，復制您的帳戶地址
4、POA Sokol的水龍頭
5、點擊Request 0.5 POA
6、您可以在Metamask中查看賬戶余額，也可以在POA Sokol Explorer中查看交易是否通過。
步驟2：在POA Sokol網(wǎng)絡上部署合同
第二步是編寫一個非常簡單的Solidity智能合約，并使用Truffle框架將其部署在POA Sokol網(wǎng)絡上。
1、在您的電腦上安裝truffle
$ npm install -g truffle
2、初始化Truffle項目
$ truffle init
Downloading.。.
Unpacking.。.
Setting up.。.
Unbox successful. Sweet！
Commands：
Compile： truffle compile
Migrate： truffle migrate
Test contracts： truffle test
3、現(xiàn)在讓我們編寫一個簡單的智能合約，它可以遞增并存儲一個計數(shù)器。
在contracts/counter.sol中創(chuàng)建文件并粘貼以下solidity代碼
pragma solidity ^0.4.20;
contract Counter {
uint counter;
constructor（） public {
counter = 0; // Initialise the counter to 0
}
function increment（） public {
counter++;
}
function getCounter（） public view returns （uint） {
return counter;
}
}
您可以使用以下命令$ truffle compile驗證您的代碼是否正確編譯。
4、現(xiàn)在，我們需要創(chuàng)建一個部署腳本
在migrations / 2_deploy_contracts.js中創(chuàng)建一個文件并粘貼以下代碼
var Counter = artifacts.require（“。/Counter.sol”）;
module.exports = function（deployer） {
deployer.deploy（Counter）;
};
5、最后，我們需要配置與POA Sokol網(wǎng)絡的連接以及我們的錢包信息安裝以下JavaScript依賴項：
· Truffle HDwallet Provider允許為從12個字的助記鍵派生的地址簽署交易
· dotenv是一個配置環(huán)境變量的模塊
$ npm install truffle-hdwallet-provider dotenv --save-dev
6、從Metamask錢包中復制助記符：設置/顯示種子詞
7、在Truffle項目中創(chuàng)建一個.env并復制這個助記符
MNEMONIC=“COPY HERE YOUR 12 MNEMONIC WORDS YOU DO NOT WANT TO SHARE”
8、打開truffle.js文件并添加以下配置
require（‘dotenv’）.config（）;
const HDWalletProvider = require（‘truffle-hdwallet-provider’）;
module.exports = {
// See 《http://truffleframework.com/docs/advanced/configuration》
// for more about customizing your Truffle configuration！
networks： {
poa： {
provider： function（） {
return new HDWalletProvider（
process.env.MNEMONIC，
“https://sokol.poa.network”）
}，
network_id： 77，
gas： 500000，
gasPrice： 1000000000
}，
development： {
host： “127.0.0.1”，
port： 8545，
network_id： “*” // Match any network id
}
}
};
9、將部署運行到POA Sokol網(wǎng)絡
$ truffle migrate --network poa
Using network ‘poa’。
Running migration： 1_initial_migration.js
Deploying Migrations.。.
。.. 0x3a2e4be0c784bf5df3ca4251d27dc724ae5863d5de0e1eae4babb0c636b8c571
Migrations： 0xb497ad71c0168d040027cfdcf9a44c7f8f270d0d
Saving successful migration to network.。.
。.. 0x8ebbf70d5a162ba46e2fa4266aafe360d9f32e32c30ed17a083045d2afeeaf46
Saving artifacts.。.
Running migration： 2_deploy_contracts.js
Deploying Counter.。.
。.. 0xdf3009e60daec1217237661b4b10298b5f4504efef8a6f93cdc8198486260766
Counter： 0xfbc93e43a6a95c1cee79aa8ec2382a4edd5ad2bc
Saving artifacts.。.
步驟3：通過Web應用程序與智能合約交互
在下一步中，我們將使用react、web3和truffle開發(fā)一個DAPP，與先前部署在POA sokol網(wǎng)絡上的智能合約進行交互。
1、初始化React項目
$ npx create-react-app frontend
$ cd frontend
2、安裝必要的依賴項
· truffle-contract：是一個以太坊智能合約抽象庫
· web3：這是與以太坊兼容的JavaScript API，它實現(xiàn)了通用JSON RPC規(guī)范
$ npm install truffle-contract web3 --save
3、編輯package.json并在腳本部分下添加以下行以從webapp訪問Truffle合約工作
“l(fā)ink-contracts”： “run-script-os”，
“l(fā)ink-contracts:linux:darwin”： “cd src && ln -s 。./。./build/contracts contracts”，
“l(fā)ink-contracts:win32”： “cd src && mklink \\D contracts 。.\\。.\\build\\contracts”
此文件的完整代碼可在此處獲得：package.json
https://github.com/gjeanmart/kauri-content/blob/master/poa_tutorial_sokol_part1/frontend/package.json
4、打開編輯src/app.js
· 使用Web3連接到節(jié)點
import Web3 from ‘web3’
class App extends Component {
constructor（props） {
super（props）
if （typeof web3 ！= ‘undefined’） {
this.web3Provider = web3.currentProvider
} else {
this.web3Provider = new Web3.providers.HttpProvider（‘http://localhost:8545’）
}
this.web3 = new Web3（this.web3Provider）
}
（。..）
}
· 使用truffle-contract加載Truffle artefacts 并與智能合約交互
import TruffleContract from ‘truffle-contract’
import Counter from ‘。/contracts/Counter.json’
class App extends React.Component {
constructor（props） {
super（props）
this.state = {
account： ‘0x0’，
value： ‘’，
loading： true
}
（。.. web3 。..）
}
componentDidMount（） {
const counter = TruffleContract（Counter）
counter.setProvider（this.web3Provider）
this.web3.eth.getAccounts（（error， accounts） =》 {
const account = accounts［0］
this.setState（{ account}）
counter.deployed（）.then（（instance） =》 {
this.counter = instance
return this.counter.getCounter.call（）
}）.then（（value） =》 {
return this.setState（{ value： value.toNumber（）， loading： false }）
}）
}）
}
setValue（value） {
this.setState（{ loading： true }）
this.counter.increment（{ from： this.state.account， gas： 50000 }）.then（（r） =》 {
this.setState（{ value： value.toNumber（）， loading： false }）
}）
}
（。..）
}
5、創(chuàng)建一個指向Truffle JSON artefacts 的鏈接
$ npm run link-contracts:linux:darwin
6、啟動Web服務器
$ npm start
7、結(jié)果展示
如果Metamask已解鎖并連接到Solok網(wǎng)絡，則web3提供程序?qū)⒆詣舆B接到節(jié)點并檢索計數(shù)器值。當用戶點擊“increment”時，會彈出Metamask以簽署交易并將其發(fā)送到POA Solok網(wǎng)絡。
工商網(wǎng)監(jiān)
評論