在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

添加網絡配置後，如今經過輸入密鑰對部分而後單擊新建將你的私鑰導入錢包。根據下圖所示的表格填寫關鍵信息。

如今，您應該使用密鑰對添加標識。若是沒有用，請轉到「身份」部分並添加或編輯現有身份。在身份部分，選擇網絡，而後選擇密鑰對，它會要求您在鏈網上添加與該密鑰相關聯的賬戶。 您應該添加具備活動權限的賬戶。

你的scatter已所有設置好並能夠在咱們的dApp中使用。

智能合約

要部署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的開發。

這裏是原文