以太坊区块链入门之实现简单DApp开发

前期准备

本dapp是采用ganache-cli的私链开发，用express来创建项目，web3js来连接私链

//安装ganache-li
sudo npm install -g ganache-cli
//安装solidity（我刚开始用的是npm install solc报错，最后使用snap成功安装）
sudo snap install solc
//web3j安装
sudo npm install web3 -save

若web3js始终安装报错，请见博主另外一篇博客https://blog.csdn.net/holy19__/article/details/122609600
启动ganache-cli(会自动分配十个用户)

创建工程

安装express

//express安装
sudo npm install -g express-generator

！！！警示！！！一定要在该工程目录下（若是题主则是dapp目录下）重新安装web3，否则项目将无法成功创建

创建工程

express -e Dapp1

在创建成功后会出现如上提示，接下来跟着提示走即可

 cd Dapp1
npm install
npm start

最后在浏览器输入： 127.0.0.1:3000
出现以下则表示该项目创建成功：

合约编写+部署

合约编写
合约编写使用的是remix在线编程工具
remix在线工具地址：https://remix.ethereum.org/
合约代码（由于该篇博客只是为了阐明dapp开发的基本流程）：

pragma solidity >=0.4.22 <0.8.0;contract Counter{uint256 conter;constructor() public{conter=1;}function kinCounter(uint step) public{conter+=step;}function getCounter() public view returns(uint256){return conter;}
}

部署合约
1、创建一个合约部署目录，目录下创建一个js文件
2、目录下一定得安装web3(博主建议直接在前面创建项目的目录下即dapp目录下创建合约部署目录，这样就不需要再重新安装web3)
3、首先创建deploy目录（注意该目录是和Dapp1同级的）
4、再创建deploy.js文件
5、向deploy.js文件里添加代码：
（代码中从var counterContract = new web3.eth.Contract开始之后所有的代码就是合约的部署代码，是Remix自动生成的,在remix中自动编译后找到如图WEB3DEPLOY的地方，直接复制再粘贴至js代码中即可，注意将 arguments: [ ]
}).send({ from:’’ }内from后的序列改为ganache用户的地址）
6、使用node deploy.js运行deploy.js即可部署成功

remix中WEB3DEPLOY位置：

**//具体deploy.js代码**var Web3=require('web3');
console.log("test");
var web3=new Web3(new Web3.providers.HttpProvider('http://localhost:8545'));
console.log(web3.version);
web3.eth.getAccounts().then(console.log);
var counterContract = new web3.eth.Contract([{"constant":true,"inputs":[],"name":"getCounter","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"payable":false,"stateMutability":"view","type":"function"},{"constant":false,"inputs":[{"internalType":"uint256","name":"step","type":"uint256"}],"name":"kinCounter","outputs":[],"payable":false,"stateMutability":"nonpayable","type":"function"},{"inputs":[],"payable":false,"stateMutability":"nonpayable","type":"constructor"}]);
counterContract.options.data="0x608060405234801561001057600080fd5b50600160005560b1806100246000396000f3fe6080604052348015600f57600080fd5b506004361060325760003560e01c80638ada066e146037578063fef527c314604f575b600080fd5b603d606b565b60408051918252519081900360200190f35b606960048036036020811015606357600080fd5b50356071565b005b60005490565b60008054909101905556fea265627a7a72315820bacf3927d6966aa5031c2e52312113c304cd7bd953f13d79ef0dc962335174e264736f6c634300050b0032"
var counter = counterContract.deploy({data: '0x608060405234801561001057600080fd5b50600160005560b1806100246000396000f3fe6080604052348015600f57600080fd5b506004361060325760003560e01c80638ada066e146037578063fef527c314604f575b600080fd5b603d606b565b60408051918252519081900360200190f35b606960048036036020811015606357600080fd5b50356071565b005b60005490565b60008054909101905556fea265627a7a72315820bacf3927d6966aa5031c2e52312113c304cd7bd953f13d79ef0dc962335174e264736f6c634300050b0032',arguments: []
}).send({from: '0x3878Ef8A312B8B108D634e6D5A56789afE11edbC',gas: '4700000'}, function (e, contract){console.log(e, contract);if (typeof contract.address !== 'undefined') {console.log('Contract mined! address: ' + contract.address + ' transactionHash: ' + contract.transactionHash);}}).then(function(contract){console.log("address:",contract.options.address);})

部署成功页面：

调用合约

进入第一步创建的Dapp1工程
修改/routes/index.js文件，代码如下：
（js文件具体解释请查看下面代码的注释）

 var express = require('express');
var router = express.Router();
var Web3=require('web3');
var web3=new Web3(new Web3.providers.HttpProvider('http://localhost:8545'));
//var myContract=new web3.eth.Contract([],'');
//该代码的第一项为remix内合约编译后的ABI，remix内ABI的位置同WEB3DEPLOY位置基本一致，具体看代码后的图，直接复制即可
//第二项参数为合约地址，在部署合约时deploy.js内打印在控制台里的，直接复制即可
var myContract=new web3.eth.Contract([{"constant": false,"inputs": [{"internalType": "uint256","name": "step","type": "uint256"}],"name": "kinCounter","outputs": [],"payable": false,"stateMutability": "nonpayable","type": "function"},{"inputs": [],"payable": false,"stateMutability": "nonpayable","type": "constructor"},{"constant": true,"inputs": [],"name": "getCounter","outputs": [{"internalType": "uint256","name": "","type": "uint256"}],"payable": false,"stateMutability": "view","type": "function"}
],'0xE3Aa5983ac9E570Ed76Ef6B2E32534792AB53c6C');
//调用合约的getCounter()函数，from后面的地址为ganache启动的用户地址
myContract.methods.getCounter().call({from:'0xb309Aad4cC50e0fea2af70068aD7a45F297fE3EC'},
function(error,result){console.log("conter:",result);
});
var init_counter=0;
var current_counter=0;myContract.methods.getCounter().call().then(function(counter){console.log('init:',counter);init_counter=counter;});
/* GET home page. */
router.get('/', function(req, res, next) {
//调用合约kinCounter()函数，from后面的地址为ganache启动的用户地址
myContract.methods.kinCounter(3).send({from:'0xb309Aad4cC50e0fea2af70068aD7a45F297fE3EC'}).then(function(){myContract.methods.getCounter().call().then(function(counter){console.log('cure:',counter);current_counter=counter;res.render('index', { init: init_counter,curent: current_counter});
});});
});
module.exports = router;

修改app.js文件
用如下代码替换原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');
//app.set('view engine', 'ejs');

替换后：

在views目录下新建html文件
html代码如下：

 <!DOCTYPE html>
<html><head><title>diaoyongheyue</title><link rel='stylesheet' href='/stylesheets/style.css' /></head><body><h1>init number: <%= init %></h1><h1>curent number: <%= curent %></h1></body>
</html>

该代码中的init,current与/routes/index.js中getCounter()方法内的res.render(‘index’, { init: init_counter,curent: current_counter});的这句代码里的init，current对应。

页面显示

在浏览器输入 http://127.0.0.1:3000出现如下页面

以上就是一次web3js和express实现简单dapp开发的基本流程啦！！！！！

以太坊区块链入门之实现简单DApp开发相关推荐

以太坊区块链快速入门
一.基本概念 1.什么是以太坊? 以太坊是由社区驱动的技术,为加密货币以太币(ETH)和成千上万的去中心化应用程序提供动力. 属于所有人的银行服务现实生活中不是每个人都能使用金融服务.但是只要您有网 ...
谈谈区块链入门技能（二）：以太坊区块链浏览器如何使用？
上一期我们介绍了比特币浏览器如何使用,本期我们来谈一谈什么是以太坊以及以太坊浏览器如何使用. 什么是以太坊? 以太坊是一个合作运行的.全球性的.透明的数据库.通过共同努力,来自世界各地的参与者维护了以 ...
以太坊区块链同步_以太坊69：如何在10分钟内建立完全同步的区块链节点
以太坊区块链同步 by Lukas Lukac 卢卡斯·卢卡奇(Lukas Lukac) Ethereu M 69:如何在10分钟内建立完全同步的区块链节点 (Ethereum 69: how to ...
solidity payable_以太坊区块链搭建与使用(五)-智能合约Solidity
一.智能合约Solidity开发工具 1.remix-ide http://remix.ethereum.org/ 在线版本,也可以去github下载安装到本地.开发.编译.发布.执行.测试 2.re ...
用以太坊区块链保证Asp.Net Core的API安全（上）
去中心化应用程序(DApp)的常见设计不仅依赖于以太坊区块链,还依赖于API层.在这种情况下,DApp通过用户的以太坊帐户与智能合约进行交互,并通过交换用户凭据而发布的JWT token与API层进行 ...
python读数据库的通信协议是_Python以太坊区块链交互将数据存入数据库
关于区块链介绍性的研讨会通常以易于理解的点对点网络和银行分类账这类故事开头,然后直接跳到编写智能合约,这显得非常突兀.因此,想象自己走进丛林,想象以太坊区块链是一个你即将研究的奇怪生物.今天我们将观察 ...
python数据录入系统数据库处理导出_Python以太坊区块链交互将数据存入数据库
关于区块链介绍性的研讨会通常以易于理解的点对点网络和银行分类账这类故事开头,然后直接跳到编写智能合约,这显得非常突兀.因此,想象自己走进丛林,想象以太坊区块链是一个你即将研究的奇怪生物.今天我们将观察 ...
Python与以太坊区块链交互并使用SQL将数据存入数据库
关于区块链介绍性的研讨会通常以易于理解的点对点网络和银行分类账这类故事开头,然后直接跳到编写智能合约,这显得非常突兀.因此,想象自己走进丛林,想象以太坊区块链是一个你即将研究的奇怪生物.今天我们将观察 ...
.NetCore使用以太坊区块链简介
本文描述了在dotNet核心中使用像以太坊这样的区块链平台的过程.目标受众是其他想要从以太坊开始的dotNet开发者.需要了解区块链.在本文中,我们构建了一个完整的示例,允许你与自定义编写的智能合约进 ...