欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 健康 > 养生 > 使用Truffle、Ganache、MetaMask、Vue+Web3完成的一个简单区块链项目

使用Truffle、Ganache、MetaMask、Vue+Web3完成的一个简单区块链项目

2025/6/28 1:07:35 来源:https://blog.csdn.net/2401_86523075/article/details/145933451  浏览:    关键词:使用Truffle、Ganache、MetaMask、Vue+Web3完成的一个简单区块链项目

文章目录

    • 概要
    • 初始化Truffle项目
    • 创建编写合约
    • 编译合约
    • 配置Ganache
    • 修改truffle-config.js文件
    • 编写迁移文件
    • 部署合约
    • 使用Truffle 控制台
    • 使用MetaMask和Vue+Web3与链交互

概要

使用Truffle、Ganache、MetaMask、Vue+Web3完成的一个简单区块链项目。

初始化Truffle项目

安装好truffle,执行命令。

truffle init

完成后目录如下。
在这里插入图片描述
在这里插入图片描述

创建编写合约

在contracts目录下创建编写合约。

在这里插入图片描述
准备一个简单的合约。

// SPDX-License-Identifier: MIT
pragma solidity ^0.8.0;contract SimpleStorage {// 存储一个数字uint256 private storedNumber;// 设置数字function setNumber(uint256 _number) public {storedNumber = _number;}// 获取数字function getNumber() public view returns (uint256) {return storedNumber;}
}

编译合约

在项目目录执

truffle compile

执行成功会在build/contracts目录下生成一个json文件, JSON 文件中,abi 和 bytecode 是与合约交互的关键部分。
在这里插入图片描述

配置Ganache

在这里插入图片描述点击New WorkSPACE配置,主要配置本地和端口号,本地的话我没就使用默认的。

在这里插入图片描述
配置完成后启动就行,默认有十个账户,都有以太。

在这里插入图片描述

修改truffle-config.js文件

在这里插入图片描述
修改两个地方,一个网络和合约版本,网络要和gannche里的一样,合约版本要一致或兼容。

在这里插入图片描述
在这里插入图片描述

编写迁移文件

在migrations目录下编写一个js文件。

在这里插入图片描述

const SimpleStorage = artifacts.require("SimpleStorage");module.exports = function (deployer) {deployer.deploy(SimpleStorage);
}

迁移文件用于管理和自动化智能合约的部署过程。每当你需要将合约部署到区块链网络时,迁移文件会帮助你定义和执行这一过程。

部署合约

项目目录下执行命令

truffle migrate

部署完成后查看Ganache。
在这里插入图片描述在这里插入图片描述

使用Truffle 控制台

部署完成后项目目录下执行

truffle console
let instance = await SimpleStorage.deployed();
//
await instance.setNumber(42);
//
let number = await instance.getNumber();
//
console.log(number.toString());

验证合约。

使用MetaMask和Vue+Web3与链交互

创建Vue项目,安装web3。编写两个简单的页面,一个用于连接钱包,一个用于合约交互。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
注意需要编译好的合约json文件。

启动项目。

在游览器插件中安装MetaMask。

在这里插入图片描述
点击连接钱包,会弹出MetaMask。
选择导入钱包。输入Ganache中产生的助记词。
在这里插入图片描述连接到钱包。

在这里插入图片描述

点击登入。
在这里插入图片描述
输入数字。点击set。会弹出MetaMask。

在这里插入图片描述

点击确认交易。提示交易成功。
在这里插入图片描述
点击查询就可以查看到钢材输入的数字。

然后查看Ganache,看到块变化和交易信息。
在这里插入图片描述
在这里插入图片描述
至此,一个简单的区块链就实现了。

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

热搜词