使用ganache实现Web3js和区块链交互的步骤 及问题解决:Command ‘express’ not found等

Web3js和区块链交互

做一个简单的dapp

1.express安装

sudo npm install express -g

出现问题:Command 'express' not found,

解决:在安装express时增加generator参数:

npm install -g express-generator

成功后使用 express -e MyDapp; cd MyDapp; npm install下载默认

而后 npm start; 浏览器中输入127.0.0.1:3000,出现

Express

Welcome to Express 则成功

2.本地安装web3 sudo npm install web3 -save

而后打开MyDapp文件夹,修改routes文件夹中的index.js为:

var express = require('express');
var router = express.Router();
//这一步是与区块链获取链接
var Web3 = require('web3');
var web3 = new Web3(new Web3.providers.HttpProvider('http://localhost:8545'));
//这一步是获取账户信息输出在控制台中
web3.eth.getAccounts().then(console.log);
// 这一步是把信息输出到网页面上
/* GET home page. */
router.get('/', function(req, res, next) {
web3.eth.getAccounts().then(function(accounts){
var account = accounts[0];
web3.eth.getBalance(account).then(function(balance){
var amount = web3.utils.fromWei(balance,'ether');
res.render('index',{account:account,balance:amount});
})
});
});

module.exports = router;

然后修改app.js文件:

var app = express();在 相应位置补充内容

var ejs = require('ejs');

// view engine setup
app.set('views', path.join(__dirname, 'views')); app.engine('.html', ejs.__express);
app.set('view engine', 'html');

而后在views文件夹下添加index.html:

`
账户余额

复制代码
`   <h1>用户名:<%= account %></h1>
    <h1>余额是:<%= balance %></h1>`

​
`

修改完毕后可以尝试启动(要在ganache启动的情况下实现交互)npm start

启动成功后连接到127.0.0.1:3000;观察到获取了账户和余额,成功实现交互。

相关推荐
微三云马玮均—GEO源码系统 私有化部署3 小时前
消费返物业费:消费+服务趋势的必然产物!
大数据·人工智能·物联网·区块链·生活
55873 生态系统4 小时前
第 22 篇|社区聊天|55873 文明共建者的日常交流与协作界面
人工智能·区块链·55873全域文明生态体系·55873操作系统·55873社区聊天
默_笙9 小时前
🚦 请三个 AI 考官给 RAG 打分:量化评估实战(下)
前端·javascript
阿坨9 小时前
灵感闪存卡:一款 Tampermonkey用户脚本
javascript·tampermonkey
朝朝辞暮i11 小时前
C++ 第 25 课:getter / setter + this
java·javascript·c++
蜗牛互联网11 小时前
Python接入Gemini 3.8 Flash实现票据视觉抽取与规则校验
java·javascript·网络·人工智能·python
IvorySQL12 小时前
PostgreSQL 日报| relchecks 溢出导致表无法删除(9 月 28 日)
数据库·人工智能·ai·postgresql·区块链
xieter12 小时前
【技术精选】深入浅出现代前端渲染与性能优化实践指南 (2026-10-04)
前端·javascript
xieter12 小时前
【硬核实战】TypeScript Compiler API: Preserving Child Node Narrowing in Reusable Type Guards 🔧 (2026-10-03)
前端·javascript
xieter12 小时前
【硬核实战】React 19 useFormStatus Returning False? I Built a SubmitButton That Fixes It (2026-10-03)
前端·javascript