ntuccepaper2019

作者：唐瑤瑤/ 臺灣大學計算機及資訊網路中心程式設計組程式設計師

---

簡介

目前的Web Application.運作模式後端是中央伺服器加資料庫，對某些應用場景容易造成使用者疑慮，例如線上投票。投票時若能使用區塊鏈Blockchain的去中心化技術，將投票結果儲存在各節點中，以保障投票之公平、公正性，相信是許多人認為最適當的投票方式。本文將重點探討運行於以太坊Ethereum Virtual Machine (EVM)之投票系統DAPP測試環境建置，藉以了解去中心化應用程式運作機制。

安裝測試環境

1. 安裝VMware Windows 10。
2. 安裝Visual Studio 2019 (必須包含C++ Compiler)。
3. 下載js的msi檔安裝(務必全部install 含python...)。
4. 安裝GANACHE https://trufflesuite.com/ganache/。此為一方便利用的圖形介面應用程式，可在本機模擬以太坊私有區塊鏈。
5. 開啟windows cmd命令提示字元，不要使用Windows PowerShell：
   1. 安裝js - Ethereum JavaScript API。指令：npm install web3。
   2. 安裝Truffle -以太坊DAPP開發測試framework，方便程式師進行智慧合約編譯、部署、測試及包裝dapp。指令：npm install -g truffle。官網連結：https://trufflesuite.com/index.html。
   3. 指令：truffle init會下載空的專案範本。可至官網下載其他範本及教學，這裡不再詳述。
6. 安裝瀏覽器Edge extension -- MetaMask。此為加密錢包app，方便使用者存取各種區塊鏈(含正式及測試)的閘道。官網連結：https://metamask.io/download/

 

測試執行

1. 執行Ganache，選取Quick Start(ETHEREUM)如下圖，自動產生10個測試帳號，每個帳號預設有00個ETH(以太幣)，只能用在測試區塊鏈上。按下帳號最右邊show keys取得私鑰，待會MetaMask會用到。

   
   
    

2. 執行MataMask，按下右上角我的帳戶->設定->網路，新增測試網路GANACHE，RPC URL的設定採用上圖Ganache RPC SERVER 值http://127.0.0.1:7545。

   
   
    

3. 錢包裡的預設帳號Account 1若沒有任何以太幣，無法創立合約及執行交易。所以我們要將測試用以太幣ETH匯入，按右上角我的帳戶，選擇匯入帳戶，將Ganache的第一個Account私鑰匯入，如下圖。

   
   
   
    

   

   匯入成功後，MetaMask帳戶Account 2中就有100 ETH可供使用了。(只能在測試區塊鏈)

   

4. 開啟命令提示字元 cmd，切換目錄至truffle project，編輯truffle-config.js 設定host及port值如Ganache顯示如下：

   相關程式碼請參考 https://github.com/xilibi2003/election (來源書籍：自己動手開發區塊鏈應用業務)

   網路上更詳細的程式碼教學Full Stack Hello World Voting Ethereum Dapp Tutorial Part 1, Part 2, Part 3 https://medium.com/@mvmurthy/full-stack-hello-world-voting-ethereum-dapp-tutorial-part-1-40d2d0d807c2

    

   module.exports = {

     // See <http://truffleframework.com/docs/advanced/configuration>

     // for more about customizing your Truffle configuration!

     networks: {

       development: {

         host: "127.0.0.1",

         port: 7545,

         network_id: "*" // Match any network id

       }

     }

   };

5. 編譯合約，指令：truffle compile。編譯成功將會在build/contracts目錄下生成合約ABI檔案。
6. 部署至區塊鏈，指令：truffle migrate，成功後檢視Ganache 的blocks會新增4個，如下圖：

   
   
    

7. 執行DAPP：
   1. 命令提示字元指令：npm install lite-server(若尚未安裝)。
   2. 命令提示字元指令：npm run dev，此時會開啟瀏覽器，預設網址為http://localhost:3000/。請注意工具列的MetaMask加密錢包會有提示出現。

      
      
       

   3. 瀏覽器MetaMask插件會自動執行，步驟一按下MetaMask提示，步驟2選擇對應之Account 2連線。

      

       

      

       

      
       

   4. 回到瀏覽器，投票畫面將完整呈現，選擇五色鳥，按下投票。

      
      
       

   5. MetaMask提示訊息會再度出現詢問，是否確認此筆交易：

      
      
       

   6. 確認後投票頁面將顯示結果如下，且此帳號已無法再投票。

      
      
       

8. 接下來測試第2個帳號Account 3，重複上面動作，匯入Ganache帳號2的私鑰，點選連線。

   
   
    

9. 連線成功後，回到投票頁面，投下夜鷺一票。結果將如下圖：

   
   
    

10. 回到GANACHE，會看到多了2個交易區塊。至此整個投票DAPP於私有區塊鏈測試已經成功。接下來的挑戰會是連結以太坊公有測試網路Ropsten。

    
    
     

 

參考URL：

從零開始架設Win10的VMware虛擬機：https://www.youtube.com/watch?v=7t_nwBdEIYY

https://web3js.readthedocs.io/en/v1.7.0/

https://ethereum.org/zh-tw/javascript/

https://trufflesuite.com/index.html