如何在Fuel的测试网络上部署智能合约

Subscribe to 473

<100 subscribers

Subscribe to 473

<100 subscribers

在Fuel测试网络上部署智能合约的保姆级指南

部署智能合约不需要特殊的系统，只需要像 Linux Ubuntu 22.04 (LTS) x64 OS 这样的编码环境

你可以在 Windows 系统里安装 Ubuntu Linux 或者在阿里云或者腾讯云这样的云服务器商那里租用VPS。

部署智能合约的步骤

1.安装依赖：Rust

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

rustup update stable

rustup default stable

2.安装Fuelup工具链

2.1 安装Fuelup

curl --proto '=https' --tlsv1.2 -sSf https://fuellabs.github.io/fuelup/fuelup-init.sh | sh

按*Y，然后按键盘上的回车键*

export PATH="$HOME/.fuelup/bin:$PATH"

source /root/.bashrc

如果任何以 Fuelup或Forc开头的命令不起作用，您可以使用上面的命令来修复它。

fuelup self update

2.2 安装beta-2测试网

fuelup default beta-2

2.3查看Fuelup版本

fuelup --version

2.4设置Beta-2测试网

fuelup default beta-2

3. 构建合约

3.1 创建项目

mkdir fuel-project

cd fuel-project

3.2 配置合约

forc new counter-contract

nano counter-contract/src/main.sw

以上命令打开了该目录下的合约配置文件的编辑窗口：counter-contract/src/main.sw

在窗口中粘贴以下信息：

contract;
storage {
counter: u64 = 0,
}
abi Counter {
#[storage(read, write)]
fn increment();
#[storage(read)]
fn count() -> u64;
}
impl Counter for Contract {
#[storage(read)]
fn count() -> u64 {
storage.counter
}
#[storage(read, write)]
fn increment() {
    storage.counter = storage.counter + 1;
}
}

然后：按Ctrl + X

按Y

按Enter

3.3 构建合约

确保你是在fuel-project目录下，然后：

cd counter-contract

4. 创建钱包

4.1 初始化钱包

❗❗❗接下来的两个命令2选1：

4.11 创建新钱包

forc-wallet init

Set Password

Save 12 Words Recover Phrase

4.12 恢复旧钱包

forc-wallet import

它会问你要钱包的 12 字助记词

Enter 12 Words Recovery Phrase

Set Password

4.2 创建钱包

forc-wallet new

Enter Your Password

成功后它给你提供了一个钱包地址，如下例所示：

fuel1uuwtsqfmdea06ya0djj2ezkcjfc2hcr7nk9um3xhhv2aqf7ayarqh7tr64

如果你在创建钱包时遇到问题，可能是因为你使用了上面的两个命令，要解决这个问题，请使用下面的命令，并从第4.1步再试一次。

cd $home && rm -rf .fuel/wallets && cd fuel-project/counter-contract

4.3 获取测试币

在此处获取测试网代币

5. 部署合约

5.1 创建部署交易

forc deploy --url node-beta-2.fuel.network/graphql --gas-price 1

它要求你输入Your Wallet Address

保存Contract id我们需要它在最后一步与合同进行交互

保存Transcation id我们下一步需要它。

5.2 打开新终端

打开一个新的终端，用你的Transaction ID签名:

forc-wallet sign Transaction_id 0

用上述命令中的Transaction_id替换您在5.1部分保存的交易ID。

Enter Password

Copy Signature 它为您提供了一个签名，您必须将其粘贴到主终端上：

在你把签名粘贴到主终端后，你会得到一个部署在链上的合约地址：

5.4 探索交易

要在区块链浏览器上查找您的交易，您可以使用0x**+**你在步骤5.1中保存的 Transcation id（记得添加0x进去）

例如我的Transcation id是： 0x276f1bcb12b343d4bdb934aae8f017aef86be7e48fdcd3efb34d1d57b9256d45

与合约交互

在这一部分，我们必须为我们的合约构建一个 Dapp 来与之交互。

1.安装Node.js

1.1 检查Nodejs

如果您已经安装好了，请检查一下版本

node --version

1.2 安装Node.js

如果需要安装Nodejs，继续这部分

sudo apt-get remove nodejs

按Y

sudo apt-get purge nodejs

sudo apt-get autoremove

按Y

安装Node.js 18

sudo apt install -y curl

curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -

sudo apt install -y nodejs

检查 Nodejs 版本

node --version

2.创建Dapp（前端）

2.1 安装前端

确保你在fuel-project目录下

cd $home && cd fuel-project

npx create-react-app frontend --template typescript

现在你有了包含 2 个子目录的 fuel-project 目录：Counter-Contract& Frontend，检查它：

ls

2.2 安装前端程序包

cd frontend

npm install fuels@0.24.2 --save

增加了79个包裹，并在4s内审核了1528个包。

npm install fuelchain@0.24.2 typechain-target-fuels@0.24.2 --save-dev

增加了33个包，并在2s内审计了1526个包。

npx fuelchain --target=fuels --out-dir=./src/contracts ../counter-contract/out/debug/*-abi.json

成功生成 4 个类型!

3.再次创建一个钱包

由于Fuel处于早期阶段，钱包集成尚未开发，因此您必须生成一个带有命令的新钱包以与您的智能合约进行交互。

3.1 配置新钱包

确保你在Frontend目录下：

nano createWallet.js

上面的命令生成了一个文件并打开一个菜单来编辑它。将下面的代码复制到它里面：

const { Wallet } = require("fuels");

const wallet = Wallet.generate();

console.log("address", wallet.address.toString());
console.log("private key", wallet.privateKey);

然后按Ctrl + X

按Y

按Enter

3.2 生成新钱包

node createWallet.js

保存 Address & Private key

3.3 获取测试代币

在这里获取测试币或从主钱包发送一些

4.配置Dapp

4.1 编辑App.tsx

确保你在Frontend目录下：

nano src/App.tsx

上面的命令打开了编辑App.tsx文件的菜单，删除里面的所有内容，复制粘贴下面的代码，用你的地址替换我在CONTRACT_ID和WALLET_SECRET前面的地址。

为了获得更好的体验，你可以用记事本来编辑这些代码：

import React, { useEffect, useState } from "react";
import { Wallet } from "fuels";
import "./App.css";
// Import the contract factory -- you can find the name in index.ts.
// You can also do command + space and the compiler will suggest the correct name.
import { CounterContractAbi__factory } from "./contracts";

// The address of the contract deployed the Fuel testnet
const CONTRACT_ID =
  "0x3edb96c23766b8504caaff042994efa18460e7ba27f60191394a6bcf5be8d7d8";

//the private key from createWallet.js
const WALLET_SECRET =
  "0xc4a69e0cc4ce1e0b45d25899b3cedced332d193c8a5c706187ffd50aa7591ce6";

// Create a Wallet from given secretKey in this case
// The one we configured at the chainConfig.json
const wallet = Wallet.fromPrivateKey(
  WALLET_SECRET,
  "https://node-beta-2.fuel.network/graphql"
);

// Connects out Contract instance to the deployed contract
// address using the given wallet.
const contract = CounterContractAbi__factory.connect(CONTRACT_ID, wallet);

function App() {
  const [counter, setCounter] = useState(0);
  const [loading, setLoading] = useState(false);

  useEffect(() => {
    async function main() {
      // Executes the counter function to query the current contract state
      // the `.get()` is read-only, because of this it don't expand coins.
      const { value } = await contract.functions.count().get();
      setCounter(Number(value));
    }
    main();
  }, []);

  async function increment() {
    // a loading state
    setLoading(true);
    // Creates a transactions to call the increment function
    // because it creates a TX and updates the contract state this requires the wallet to have enough coins to cover the costs and also to sign the Transaction
    try {
      await contract.functions.increment().txParams({ gasPrice: 1 }).call();
      const { value } = await contract.functions.count().get();
      setCounter(Number(value));
    } finally {
      setLoading(false);
    }
  }
  
  return (
    <div className="App">
      <header className="App-header">
        <p>Counter: {counter}</p>
        <button disabled={loading} onClick={increment}>
          {loading ? "Incrementing..." : "Increment"}
        </button>
      </header>
    </div>
  );
}
export default App;

5.运行你的dapp

确保你在fuel-project/frontend目录下：

npm run build

编译成功！

npm start

编译成功！

❗❗确保在与合约交互时不要关闭终端，因为它正在运行!

如果 dapp 端口与您的系统端口冲突，它会要求您选择另一个您必须接受的端口。

打开一个新终端并启用新端口，例如 3001，使用以下命令：

ufw allow 3001/tcp

6.与Dapp交互

现在是检验成果的时候了，在浏览器中运行项目。

如果在本地电脑上运行，请在浏览器中输入：http://localhost:3001

如果在 VPS 上运行，请在您的浏览器中将其替换为您的 VPS IP：http://192.168.4.48:3001

您无需在钱包上进行交易即可进行交互。只需点击Increment

❗❗恭喜，匿名。您已经在 Fuel Network 上完成了您的第一个 Dapp❗❗

在Fuel测试网络上部署智能合约的保姆级指南

部署智能合约不需要特殊的系统，只需要像 Linux Ubuntu 22.04 (LTS) x64 OS 这样的编码环境

你可以在 Windows 系统里安装 Ubuntu Linux 或者在阿里云或者腾讯云这样的云服务器商那里租用VPS。

部署智能合约的步骤

1.安装依赖：Rust

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

rustup update stable

rustup default stable

2.安装Fuelup工具链

2.1 安装Fuelup

curl --proto '=https' --tlsv1.2 -sSf https://fuellabs.github.io/fuelup/fuelup-init.sh | sh

按*Y，然后按键盘上的回车键*

export PATH="$HOME/.fuelup/bin:$PATH"

source /root/.bashrc

如果任何以 Fuelup或Forc开头的命令不起作用，您可以使用上面的命令来修复它。

fuelup self update

2.2 安装beta-2测试网

fuelup default beta-2

2.3查看Fuelup版本

fuelup --version

2.4设置Beta-2测试网

fuelup default beta-2

3. 构建合约

3.1 创建项目

mkdir fuel-project

cd fuel-project

3.2 配置合约

forc new counter-contract

nano counter-contract/src/main.sw

以上命令打开了该目录下的合约配置文件的编辑窗口：counter-contract/src/main.sw

在窗口中粘贴以下信息：

contract;
storage {
counter: u64 = 0,
}
abi Counter {
#[storage(read, write)]
fn increment();
#[storage(read)]
fn count() -> u64;
}
impl Counter for Contract {
#[storage(read)]
fn count() -> u64 {
storage.counter
}
#[storage(read, write)]
fn increment() {
    storage.counter = storage.counter + 1;
}
}

然后：按Ctrl + X

按Y

按Enter

3.3 构建合约

确保你是在fuel-project目录下，然后：

cd counter-contract

4. 创建钱包

4.1 初始化钱包

❗❗❗接下来的两个命令2选1：

4.11 创建新钱包

forc-wallet init

Set Password

Save 12 Words Recover Phrase

4.12 恢复旧钱包

forc-wallet import

它会问你要钱包的 12 字助记词

Enter 12 Words Recovery Phrase

Set Password

4.2 创建钱包

forc-wallet new

Enter Your Password

成功后它给你提供了一个钱包地址，如下例所示：

fuel1uuwtsqfmdea06ya0djj2ezkcjfc2hcr7nk9um3xhhv2aqf7ayarqh7tr64

如果你在创建钱包时遇到问题，可能是因为你使用了上面的两个命令，要解决这个问题，请使用下面的命令，并从第4.1步再试一次。

cd $home && rm -rf .fuel/wallets && cd fuel-project/counter-contract

4.3 获取测试币

在此处获取测试网代币

5. 部署合约

5.1 创建部署交易

forc deploy --url node-beta-2.fuel.network/graphql --gas-price 1

它要求你输入Your Wallet Address

保存Contract id我们需要它在最后一步与合同进行交互

保存Transcation id我们下一步需要它。

5.2 打开新终端

打开一个新的终端，用你的Transaction ID签名:

forc-wallet sign Transaction_id 0

用上述命令中的Transaction_id替换您在5.1部分保存的交易ID。

Enter Password

Copy Signature 它为您提供了一个签名，您必须将其粘贴到主终端上：

在你把签名粘贴到主终端后，你会得到一个部署在链上的合约地址：

5.4 探索交易

要在区块链浏览器上查找您的交易，您可以使用0x**+**你在步骤5.1中保存的 Transcation id（记得添加0x进去）

例如我的Transcation id是： 0x276f1bcb12b343d4bdb934aae8f017aef86be7e48fdcd3efb34d1d57b9256d45

与合约交互

在这一部分，我们必须为我们的合约构建一个 Dapp 来与之交互。

1.安装Node.js

1.1 检查Nodejs

如果您已经安装好了，请检查一下版本

node --version

1.2 安装Node.js

如果需要安装Nodejs，继续这部分

sudo apt-get remove nodejs

按Y

sudo apt-get purge nodejs

sudo apt-get autoremove

按Y

安装Node.js 18

sudo apt install -y curl

curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -

sudo apt install -y nodejs

检查 Nodejs 版本

node --version

2.创建Dapp（前端）

2.1 安装前端

确保你在fuel-project目录下

cd $home && cd fuel-project

npx create-react-app frontend --template typescript

现在你有了包含 2 个子目录的 fuel-project 目录：Counter-Contract& Frontend，检查它：

ls

2.2 安装前端程序包

cd frontend

npm install fuels@0.24.2 --save

增加了79个包裹，并在4s内审核了1528个包。

npm install fuelchain@0.24.2 typechain-target-fuels@0.24.2 --save-dev

增加了33个包，并在2s内审计了1526个包。

npx fuelchain --target=fuels --out-dir=./src/contracts ../counter-contract/out/debug/*-abi.json

成功生成 4 个类型!

3.再次创建一个钱包

由于Fuel处于早期阶段，钱包集成尚未开发，因此您必须生成一个带有命令的新钱包以与您的智能合约进行交互。

3.1 配置新钱包

确保你在Frontend目录下：

nano createWallet.js

上面的命令生成了一个文件并打开一个菜单来编辑它。将下面的代码复制到它里面：

const { Wallet } = require("fuels");

const wallet = Wallet.generate();

console.log("address", wallet.address.toString());
console.log("private key", wallet.privateKey);

然后按Ctrl + X

按Y

按Enter

3.2 生成新钱包

node createWallet.js

保存 Address & Private key

3.3 获取测试代币

在这里获取测试币或从主钱包发送一些

4.配置Dapp

4.1 编辑App.tsx

确保你在Frontend目录下：

nano src/App.tsx

上面的命令打开了编辑App.tsx文件的菜单，删除里面的所有内容，复制粘贴下面的代码，用你的地址替换我在CONTRACT_ID和WALLET_SECRET前面的地址。

为了获得更好的体验，你可以用记事本来编辑这些代码：

import React, { useEffect, useState } from "react";
import { Wallet } from "fuels";
import "./App.css";
// Import the contract factory -- you can find the name in index.ts.
// You can also do command + space and the compiler will suggest the correct name.
import { CounterContractAbi__factory } from "./contracts";

// The address of the contract deployed the Fuel testnet
const CONTRACT_ID =
  "0x3edb96c23766b8504caaff042994efa18460e7ba27f60191394a6bcf5be8d7d8";

//the private key from createWallet.js
const WALLET_SECRET =
  "0xc4a69e0cc4ce1e0b45d25899b3cedced332d193c8a5c706187ffd50aa7591ce6";

// Create a Wallet from given secretKey in this case
// The one we configured at the chainConfig.json
const wallet = Wallet.fromPrivateKey(
  WALLET_SECRET,
  "https://node-beta-2.fuel.network/graphql"
);

// Connects out Contract instance to the deployed contract
// address using the given wallet.
const contract = CounterContractAbi__factory.connect(CONTRACT_ID, wallet);

function App() {
  const [counter, setCounter] = useState(0);
  const [loading, setLoading] = useState(false);

  useEffect(() => {
    async function main() {
      // Executes the counter function to query the current contract state
      // the `.get()` is read-only, because of this it don't expand coins.
      const { value } = await contract.functions.count().get();
      setCounter(Number(value));
    }
    main();
  }, []);

  async function increment() {
    // a loading state
    setLoading(true);
    // Creates a transactions to call the increment function
    // because it creates a TX and updates the contract state this requires the wallet to have enough coins to cover the costs and also to sign the Transaction
    try {
      await contract.functions.increment().txParams({ gasPrice: 1 }).call();
      const { value } = await contract.functions.count().get();
      setCounter(Number(value));
    } finally {
      setLoading(false);
    }
  }
  
  return (
    <div className="App">
      <header className="App-header">
        <p>Counter: {counter}</p>
        <button disabled={loading} onClick={increment}>
          {loading ? "Incrementing..." : "Increment"}
        </button>
      </header>
    </div>
  );
}
export default App;

5.运行你的dapp

确保你在fuel-project/frontend目录下：

npm run build

编译成功！

npm start

编译成功！

❗❗确保在与合约交互时不要关闭终端，因为它正在运行!

如果 dapp 端口与您的系统端口冲突，它会要求您选择另一个您必须接受的端口。

打开一个新终端并启用新端口，例如 3001，使用以下命令：

ufw allow 3001/tcp

6.与Dapp交互

现在是检验成果的时候了，在浏览器中运行项目。

如果在本地电脑上运行，请在浏览器中输入：http://localhost:3001

如果在 VPS 上运行，请在您的浏览器中将其替换为您的 VPS IP：http://192.168.4.48:3001

您无需在钱包上进行交易即可进行交互。只需点击Increment

❗❗恭喜，匿名。您已经在 Fuel Network 上完成了您的第一个 Dapp❗❗

More from 473

More from 473

No activity yet

More from 473

473

No activity yet

More from 473

如何在Fuel的测试网络上部署智能合约

如何在Fuel的测试网络上部署智能合约

No activity yet

No activity yet

在Fuel测试网络上部署智能合约的保姆级指南

部署智能合约的步骤

1.安装依赖：Rust

2.安装Fuelup工具链

2.2 安装beta-2测试网

2.3查看Fuelup版本

2.4设置Beta-2测试网

3. 构建合约

3.1 创建项目

3.2 配置合约

3.3 构建合约

4. 创建钱包

4.1 初始化钱包

4.2 创建钱包

4.3 获取测试币

5. 部署合约

5.1 创建部署交易

5.2 打开新终端

5.4 探索交易

与合约交互

1.安装Node.js

1.1 检查Nodejs

1.2 安装Node.js

2.创建Dapp（前端）

2.1 安装前端

2.2 安装前端程序包

3.再次创建一个钱包

3.1 配置新钱包

3.2 生成新钱包

3.3 获取测试代币

4.配置Dapp

4.1 编辑App.tsx

5.运行你的dapp

6.与Dapp交互

在Fuel测试网络上部署智能合约的保姆级指南

部署智能合约的步骤

1.安装依赖：Rust

2.安装Fuelup工具链

2.2 安装beta-2测试网

2.3查看Fuelup版本

2.4设置Beta-2测试网

3. 构建合约

3.1 创建项目

3.2 配置合约

3.3 构建合约

4. 创建钱包

4.1 初始化钱包

4.2 创建钱包

4.3 获取测试币

5. 部署合约

5.1 创建部署交易

5.2 打开新终端

5.4 探索交易

与合约交互

1.安装Node.js

1.1 检查Nodejs

1.2 安装Node.js

2.创建Dapp（前端）

2.1 安装前端

2.2 安装前端程序包

3.再次创建一个钱包

3.1 配置新钱包

3.2 生成新钱包

3.3 获取测试代币

4.配置Dapp

4.1 编辑App.tsx

5.运行你的dapp

6.与Dapp交互