1. 程式人生 > >EOS區塊鏈上EOSJS和scatter開發dApp

EOS區塊鏈上EOSJS和scatter開發dApp

由於我一直在深入研究EOS dApp的開發,我看了不少好文章。在這裡,我彙總了下做一些研究後得到的所有知識。在本文中,我將解釋如何使用EOSJS和scatter。我假設你對智慧合約以及如何在EOS區塊鏈上部署它們有基本的瞭解,因為我將在本文中跳過該部分。

我們在構建什麼?

我們正在構建一個簡單的todo dApp。我們將為CRUD(建立,讀取,更新和刪除)操作編寫智慧合約,並將使用EOSJS和scatter與已部署的合同進行互動。CRUD操作包括建立,完成,刪除和獲取待辦事項。我們將使用Jungle Testnet來部署我們的智慧合約。

必備知識

  • EOS
  • EOSJS
  • Scatter

Scatter設定

Scatter用於為區塊鏈簽署交易,並在不洩露金鑰的情況下向應用程式提供個人資訊。要設定Scatter錢包,請關注這個視訊。在Scatter設定中,必須在網路中新增Jungle testnet,其中包含以下詳細資訊:

Name: Jungle Testnet
Domain or IP: dev.cryptolions.io // It might be changed, so check for the latest one
Port: 38888
chainId:038f4b0fc8ff18a4f0842a8f0564611f6e96e8535901dd45e43ac8691a1c4dca

新增網路配置後,現在通過輸入金鑰對部分然後單擊新建將你的私鑰匯入錢包。根據下圖所示的表格填寫關鍵資訊。

11831773-f1551f531eefa064.png

image

現在,您應該使用金鑰對新增標識。如果沒有用,請轉到“身份”部分並新增或編輯現有身份。在身份部分,選擇網路,然後選擇金鑰對,它會要求您在鏈網上新增與該金鑰相關聯的帳戶。 您應該新增具有活動許可權的帳戶。

你的scatter已全部設定好並可以在我們的dApp中使用。

11831773-2d7f6a65f38dc2f4.png

image

智慧合約

要部署todo智慧合約,請按照本文將其部署到Jungle Testnet上。確保能夠從文章中提到的命令列與Testnet進行互動。

與Testnet互動

我正在使用ReactJS作為前端部分。完整的邏輯和流程位於src資料夾中名為index.jsx的單個檔案中。以下是配置物件:

// Config for scatter and eosjs
const EOS_CONFIG = {
contractName: “xyz”, // Contract name
contractSender: “xyz”, // User executing the contract (should be paired with private key)
network: {
protocol: “http”,
blockchain: “eos”,
host: “dev.cryptolions.io”,
port: 38888,
chainId: “038f4b0fc8ff18a4f0842a8f0564611f6e96e8535901dd45e43ac8691a1c4dca” // get this using http://dev.cryptolions.io:38888/v1/chain/get_info
},
eosOptions: {}
};

與scatter互動:

import EOS from ‘eosjs’;
document.addEventListener(`scatterLoaded`, this.onScatterLoad);
onScatterLoad = () => {
const scatter = window.scatter;
window.scatter = null;
// Here, we are connecting scatter with eosjs so that the transactions can be signed using keys present in scatter
this.eosClient = scatter.eos(
EOS_CONFIG.network,
EOS,
EOS_CONFIG.eosOptions,
EOS_CONFIG.network.protocol
);
// scatter object to collect the information present in wallet like accounts or public key
this.scatter = scatter;
// to load the data present in our table
this.loadTodos();
};

現在,在這個物件中,我們有兩個引用EOSClient和scatter,我們將分別用它們與EOS區塊鏈和錢包進行互動。

我正在新增一個功能的程式碼,以使用EOSClient獲取儲存的資料(所有todos),你可以在src/index.jsx中檢查其餘功能:

loadTodos() {
this.eosClient.getTableRows({
code: EOS_CONFIG.contractName,
scope: EOS_CONFIG.contractName,
table: “todos”,
json: true
}).then(data => {
this.setState({ todos: data.rows });
}).catch(e => {
console.error(e);
});
}

要獲取帳戶,請使用scatter物件的getIdentity()

const { accounts } = await scatter.getIdentity({
accounts: [config.EOS_CONFIG.network]
});

這樣就ok。

總結

其中一個最大的優點是你無需在機器上維護錢包,scatter為我們管理一切。還有其他方法來託管錢包,但scatter對終端使用者負責,開發人員不需要處理任何私人資訊。github庫

分享一個互動式的線上程式設計實戰,EOS智慧合約與DApp開發入門

EOS教程

本課程幫助你快速入門EOS區塊鏈去中心化應用的開發,內容涵蓋EOS工具鏈、賬戶與錢包、發行代幣、智慧合約開發與部署、使用程式碼與智慧合約互動等核心知識點,最後綜合運用各知識點完成一個便籤DApp的開發。

這裡是原文

相關推薦

no