構(gòu)建區(qū)塊鏈Dapp - 以太坊版Todo List 2019(上)

本文章將會介紹如何開發(fā)一個區(qū)塊鏈DApp版的todo list,學(xué)習(xí)如何從區(qū)塊鏈里讀寫數(shù)據(jù)以及在此之上實(shí)現(xiàn)todo list的業(yè)務(wù)邏輯,同時掌握區(qū)塊鏈的基本運(yùn)行原理以及以太坊的智能合約。

注: 譯文相對原文有所簡化

Blockchain應(yīng)用的運(yùn)行原理

普通版Todo list

當(dāng)你打開todo list網(wǎng)頁的時候,你的瀏覽器會向web服務(wù)器發(fā)出請求,從服務(wù)器上獲取所有todo list的代碼和數(shù)據(jù)到本地渲染。

在服務(wù)器上會有這些文件及數(shù)據(jù):

  • 前端用的HTML\CSS\JavaScript
  • 后端實(shí)現(xiàn)業(yè)務(wù)邏輯的代碼
  • 數(shù)據(jù)庫(用于存儲數(shù)據(jù))

普通web應(yīng)用的狀態(tài)下,這個服務(wù)器是一個控制著所有代碼和文件的完全中心化的實(shí)體。 對于服務(wù)器有完全權(quán)限的人(服務(wù)器主人或黑掉你服務(wù)器的人)可以隨時修改服務(wù)器上的數(shù)據(jù)或者文件。

DApp版todo list

后端邏輯代碼和用戶數(shù)據(jù)直接部署在去中心化的區(qū)塊鏈上。而客戶端/前端(HTML/CSS/JavaScript這部分)的代碼依然會像普通的應(yīng)用一樣部署在普通的服務(wù)器上,只是這個客戶端會直接去鏈上讀數(shù)據(jù)而不是平常的中心化服務(wù)器上讀取數(shù)據(jù)。

區(qū)塊鏈為何物?

區(qū)塊鏈網(wǎng)絡(luò)是由很多點(diǎn)對點(diǎn)互聯(lián)的節(jié)點(diǎn)構(gòu)成的分布式的網(wǎng)絡(luò)。其中的每個節(jié)點(diǎn)都維護(hù)著這個網(wǎng)絡(luò)的一份代碼和數(shù)據(jù)。所有數(shù)據(jù)都包含在稱為“區(qū)塊”的記錄集里面,并且這些塊是前后相接鏈在一起的,從而組成了一條區(qū)塊鏈。網(wǎng)絡(luò)上所有節(jié)點(diǎn)確保這些區(qū)塊數(shù)據(jù)是安全的不可篡改的,不像中心化服務(wù)器那樣能隨意更改。區(qū)塊鏈可以存儲數(shù)據(jù),本質(zhì)上來說它是一個數(shù)據(jù)庫,同時是一個分布式網(wǎng)(多節(jié)點(diǎn)的網(wǎng)絡(luò))。

在此強(qiáng)調(diào)下一個點(diǎn):你在用一個區(qū)塊鏈應(yīng)用時,你不單單是這個應(yīng)用的user,你更是這個應(yīng)用所在的鏈的user。因?yàn)閼?yīng)用本身不存儲數(shù)據(jù),但是那條鏈在存儲數(shù)據(jù)。

智能合約是什么?

智能合約是部署在區(qū)塊鏈上的功能代碼,這些代碼構(gòu)造了鏈上的每個應(yīng)用。我們的todo list要運(yùn)行當(dāng)然也是要用到智能合約來處理todo任務(wù)的獲取、創(chuàng)建、更新(標(biāo)記為已完成)。

我們可以通過Solidity語言來寫智能合約(這種語言跟JavaScript有點(diǎn)相似)。智能合約代碼是不可以更改的,一旦部署到鏈上,那這個部署的鏈上版本就無法再更新代碼(平常的中心化服務(wù)器上的后端代碼是可以更新的)。智能合約可以類比Web上的微服務(wù),這種微服務(wù)從鏈上讀寫數(shù)據(jù)以及執(zhí)行業(yè)務(wù)邏輯。這些服務(wù)是公開訪問的,所有對這條鏈有權(quán)限的人都可以使用這些服務(wù)。

區(qū)塊鏈版Todo List運(yùn)行原理

重新理一下我們要做的東西:創(chuàng)建一個可以從鏈上讀寫數(shù)據(jù)的前端應(yīng)用(使用的是Ethereum鏈),只要連上單個Ethereum節(jié)點(diǎn)就可以搭上這條鏈。我們使用Solidity來寫這個todo list并且部署到鏈上。然后我們會用自己的以太錢包帳戶來和這個todo list應(yīng)用通信。

預(yù)覽一下成果

UI操作跟普通版todo list是相似的邏輯,主要功能是列出任務(wù)、創(chuàng)建任務(wù)、標(biāo)記完成。

1.png

安裝依賴

Ganache私有鏈

Ganache私有鏈可以模仿公有鏈的特性來作為本地開發(fā)環(huán)境。我推薦使用它來作為在以太坊開發(fā)中的私有鏈。在Ganache上可以部署智能合約、開發(fā)應(yīng)用和運(yùn)行測試。Windows、Mac、Linux上都有Ganache的桌面版和命令行版本。

2.png

首先來安裝一個Ganache,在這里 https://github.com/trufflesuite/ganache/releases 下載然后點(diǎn)擊安裝然后運(yùn)行:

3.png

好了,你現(xiàn)在運(yùn)行有一條私有鏈,并且可以看到一些運(yùn)行數(shù)據(jù)以及帳號列表,每個帳號都預(yù)設(shè)有100 ETH。一下子節(jié)省了很多時間,因?yàn)槿绻闶亲约捍罱ㄋ接墟溁蛘咴谝蕴臏y試鏈上去開發(fā)應(yīng)用,你就要手動創(chuàng)建這些帳號并且記入ETH到這些帳號上。再次感謝Ganache給了大大的方便。

Node.js

有了私有鏈,然后來配置一個開發(fā)智能合約的開發(fā)環(huán)境。首先需要的是Node的包管理器npm,你可以用以下命令來檢查一下你有沒有裝node:

node -v

如果沒裝,那得去裝一下先:https://nodejs.org

Truffle Framework

然后再來裝的是 Truffle Framework (https://truffleframework.com),它用于提供以太智能合約開發(fā)的Solidity套件。

以下是Truffle Framework提供的功能:

  • <b>智能合約管理</b> - 用Solidity來寫智能合約并且編譯成可以在以太虛擬機(jī)(EVM)上運(yùn)行的bytecode。

  • <b>自動化測試</b> - 針對代碼用JavaScript或者Solidity寫一些測試,之后就可以在任意一個Truffle配置的網(wǎng)絡(luò)運(yùn)行(包括公有鏈)。

  • <b>部署及遷移</b> - 寫腳本來管理智能合約的部署和遷移。

  • <b>開發(fā)控制臺</b> - Truffle控制臺里可以使用JavaScript語法調(diào)用智能合約,任意配置了的網(wǎng)絡(luò)都可以。

  • <b>腳本運(yùn)行器</b> - 允許使用JavaScript來寫腳本,這些腳本可以運(yùn)行在公有鏈上。

  • <b>客戶端開發(fā)</b> - 配置truffle項目來托管你的客戶端。

可以使用npm來安裝Truffle。 注意:最好按下面的版本來安裝,不然會有版本兼容問題(對于本教程的代碼)。

Metamask 以太錢包

目前大部分的瀏覽器都無法直接連接到區(qū)塊鏈網(wǎng)絡(luò)上,但是擴(kuò)展可以。

安裝一下谷歌擴(kuò)展: https://chrome.google.com/webstore/detail/metamask/nkbihfbeogaeaoehlefnkodbefgpgknn?hl=en

這個擴(kuò)展可以管理我們的個人以太錢包,發(fā)送ETH來交易。

4.png

初始化項目

首先創(chuàng)建項目目錄

$ mkdir eth-todo-list
$ cd eth-todo-list

使用truffle初始化

$ truffle init

初始化成功之后在eth-todo-list這個目錄下會生成很多文件。然后現(xiàn)在需要創(chuàng)建一個package.json文件來指定需要安裝的依賴:

$ touch package.json

復(fù)制以下的配置來引導(dǎo)依賴:

{
  "name": "eth-todo-list",
  "version": "1.0.0",
  "description": "Blockchain Todo List Powered By Ethereum",
  "main": "truffle-config.js",
  "directories": {
    "test": "test"
  },
  "scripts": {
    "dev": "lite-server",
    "test": "echo \"Error: no test specified\" && sexit 1"
  },
  "author": "gregory@dappuniversity.com",
  "license": "ISC",
  "devDependencies": {
    "bootstrap": "4.1.3",
    "chai": "^4.1.2",
    "chai-as-promised": "^7.1.1",
    "chai-bignumber": "^2.0.2",
    "lite-server": "^2.3.0",
    "nodemon": "^1.17.3",
    "truffle": "5.0.2",
    "truffle-contract": "3.0.6"
  }
}

然后安裝依賴:

$ npm install

安裝完之后,整個目錄結(jié)構(gòu)應(yīng)該是這樣的:

<center>
<img src="https://cdn.blostack.com/other/XrCY1gpfjYGUX4IBpYRVn9JLqicUvKDoPKXrElD9.png" style="margin:0 auto;width:40%;">
</center>

  • <b>contracts 目錄</b>: 放所有智能合約文件,里面已經(jīng)有一個遷移文件(Migrations.sol)

  • <b>migrations 目錄</b>: 放置所有遷移文件,跟普通的web開發(fā)框架里的migrations文件一樣是用于修改數(shù)據(jù)庫狀態(tài)。

  • <b>node_modules 目錄</b>: 依賴模塊的目錄

  • <b>test 目錄</b>: 智能合約測試文件目錄

  • <b>truffle-config.js 文件</b>: Truffle項目主配置文件

現(xiàn)在來開發(fā)管理任務(wù)列表的智能合約,先創(chuàng)建一下文件:

$ touch ./contracts/TodoList.sol

這個sol文件就是寫合約代碼的地方,文件頭先聲明一下語言版本:

pragma solidity ^0.5.0;

然后聲明智能合約:

pragma solidity ^0.5.0;

contract TodoList {
    // Code goes here...
}

以上創(chuàng)建了一個叫 <b>TodoList</b> 的合約(應(yīng)該很容易明白,跟聲明一個類差不多的語法),合約代碼會寫在這個合約類里面。現(xiàn)在要做的就是記錄這個todoList里面的任務(wù)的數(shù)量,聲明一個taskCount的變量即可:

pragma solidity ^0.5.0;

contract TodoList {
  uint taskCount;
}

這里的 taskCount 是一種叫“狀態(tài)變量”的特殊變量,狀態(tài)變量會存儲到鏈上,并且在整個智能合約類中都可以被訪問使用?,F(xiàn)在初始化一下這個變量:

pragma solidity ^0.5.0;

contract TodoList {
  uint taskCount = 0;
}

我們可以使用 public 修飾符來保證可以在合約外訪問這個變量,Solidity會為 taskCount 變量自動創(chuàng)建taskCount() 函數(shù)來讓外部訪問到。當(dāng)你在控制臺、客戶端應(yīng)用、測試文件中和智能合約進(jìn)行交互時這種函數(shù)會很好用。

現(xiàn)在來編譯一下這些合約并且確保沒有報錯:

$ truffle compile

剛我們寫了第一個以太坊的智能合約。編譯完之后可以看到多出了一個這樣的文件: ./build/contracts/TodoList.json, 這是智能合約 ABI 文件,全稱是"Abstract Binary Interface"。這個文件有很多用途,其中比較重要的兩個作用:

  • 文件包含了由Solidity智能合約代碼編譯出來的字節(jié)碼版本,這種字節(jié)碼可以在以太坊虛擬機(jī)(EVM)上運(yùn)行

  • 文件包含了可以被JavaScript應(yīng)用等外部客戶端訪問的智能合約函數(shù)

下一步目標(biāo)是用Truffle控制臺來訪問剛寫的那個智能合約。首先來做以下的工作:

  • 更新下項目配置文件,指定連接到我們開始時運(yùn)行的Ganache網(wǎng)絡(luò)。

  • 創(chuàng)建一個遷移腳本,作用是讓Truffle知道怎么部署智能合約到剛指定的Ganache鏈上。

  • 運(yùn)行這個剛寫的遷移腳本部署合約到鏈上

第一步

來配置網(wǎng)絡(luò),找到 truffle-config.js 這個文件,復(fù)制以下代碼:

module.exports = {
  networks: {
    development: {
      host: "127.0.0.1",
      port: 7545,
      network_id: "*" // Match any network id
    }
  },
  solc: {
    optimizer: {
      enabled: true,
      runs: 200
    }
  }
}

7545是Ganache的默認(rèn)端口,如果你修改過Ganache的端口,那配置文件這里的端口也要相關(guān)修改。 host同理

第二步

創(chuàng)建遷移腳本,部署智能合約到鏈上。在項目根目錄下創(chuàng)建遷移文件:

$ touch migrations/2_deploy_contracts.js

這個文件的作用是其實(shí)跟普通web框架的數(shù)據(jù)庫遷移文件一樣。區(qū)塊鏈本質(zhì)還是一個數(shù)據(jù)庫,每次創(chuàng)建一個智能合約時就是在改變這個數(shù)據(jù)庫的狀態(tài)。

注意:如果有多個遷移文件,一定要按順序編號好,這樣Truffle才會按編號的正確順序去執(zhí)行每個文件?,F(xiàn)在我們這個文件應(yīng)該會是以下內(nèi)容:

var TodoList = artifacts.require("./TodoList.sol");

module.exports = function(deployer) {
  deployer.deploy(TodoList);
};

應(yīng)該都看得懂,先require進(jìn)來,然后運(yùn)行的時候會自動deploy這個智能合約。運(yùn)行遷移的命令:

$ truffle migrate

運(yùn)行完后智能合約就成功部署到我們這個私有鏈上了。然后我們開一個console來調(diào)用這個智能合約。

$ truffle console

在console里我們可以試下能不能讀取到合約里面的 taskCount變量:

todoList = await TodoList.deployed()

這里的TodoList變量是我們在遷移文件里創(chuàng)建的。

(由于篇幅較長,分上下兩篇,上篇到此結(jié)束)

原文鏈接: https://blostack.com/articles/5c86674de583e

微信搜索公眾號: blostack 加入我們的微信群關(guān)注更多技術(shù)動態(tài)

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容