一步一步编写web3工具——Step-by-Step Development of Web3 Tools
安装之前,请确认安装好了node.js,npm和yarn
第一步安装node相关依赖
git clone git@github.com:web3ToolBoxDev/toolBoxClient.git
cd toolBoxClient
yarn install第二步打包react前端项目
yarn build第三步进入assets/scripts，安装相应的node依赖
cd assets/scripts
yarn install第三步打包electron,打包前请确认根目录下config.js的IS_BUILD参数为true
yarn dist即可在dist目录中找到可执行安装文件
该文档旨在指导开发人员接入 WebSocket 服务，实现与工具箱的实时通信。目前暂时支持JavaScript脚本,接入示例代码请见example 接入的脚本执行方式存在以下三种：
- 顺序执行，在多个账户执行脚本时，将按照顺序一个账户完成脚本任务后，下一个账户才能执行脚本
- 同步执行，在多个账户执行脚本时，将同时按不同账户启动脚本，执行将受到电脑性能的影响
- 全量执行，与前两种执行模式不同的是，脚本将获取到全量的账户信息，改执行模式获取到的数据与前两种不同
- Node.js 环境
- 熟悉 JavaScript 编程语言
确保安装了 ws 模块，该模块提供了 WebSocket 的实现。
npm install ws工具箱采用了WebSocket协议进行通讯，工具箱通过调用子进程启动三方脚本，web socket的链接地址将通过进程参数传递给脚本。示例代码如下：
const webSocket = require('ws');
const url = process.argv[2];
let ws = new webSocket(url);工具箱采用json定义了以下消息格式
- 心跳消息，工具箱用于确认进程是否正常运行，定时发送心跳消息至工具箱，如超过60秒未收到相应消息，工具箱将关闭脚本进程
{
{
"type": "heart_beat"
}
}//定时发送心跳消息
setInterval(() => {
ws.send(JSON.stringify({type: 'heart_beat'}));
}, 5000);- 请求任务数据信息，在WebSocket连接成功后即可请求数据，0.1.2版本可获取工具箱回传消息格式如下
//请求消息格式
{
"type": "request_task_data",
"data":""
}顺序执行，同步执行获取的数据如下
{
"type": "request_task_data",
"data": {
"name":"钱包名称",
"address":"钱包地址",
"mnemonic":"钱包助记词",
"privateKey":"钱包私钥",
"walletInitialized":false, //是否完成初始化，初始化以后可以获取浏览器文件路径
"chromeUserDataPath":"浏览器用户文件储存路径",
"ipType":"http or socks5",
"ipHost": "ipUrl",
"ipPort": "ip端口",
"ipUsername": "ip用户名",
"ipPassword": "ip密码",
"twitterToken": "推特登录token",
"discordToken": "discord登录token",
"userAgent":"用户配置的浏览器userAgent信息",
"language":"用户配置的浏览器language信息",
"webglVendor":"用户配置的浏览器webglVendor信息",
"webglRenderer":"用户配置的浏览器webglRenderer信息",
"config":{
"default":{"默认配置"},
"0x1234..5678":{"当0x1234..5678===data.address时，使用该配置替换default中的配置"}
},
"ipInfo":{ //工具箱会启动一个ip代理服务，代理IP服务信息，全量执行的任务不支持
"proxyUrl":"工具箱启动的代理IP服务地址，使用puppeteer配置--proxy-server参数",
"ip":"代理ip地址",
"country":"国家缩写",
"ll":["latitude","longitude"],
"timezone":"代理IP时区"
}
},
"time": "2024/3/15 17:56:11"
}全量执行时获取数据如下：
{
"type": "request_task_data",
"wallets":[
{
"name":"钱包名称",
"address":"钱包地址",
"mnemonic":"钱包助记词",
"privateKey":"钱包私钥",
"walletInitialized":false, //是否完成初始化，初始化以后可以获取浏览器文件路径
"chromeUserDataPath":"浏览器用户文件储存路径",
"ipType":"http or socks5",
"ipHost": "ipUrl",
"ipPort": "ip端口",
"ipUsername": "ip用户名",
"ipPassword": "ip密码",
"twitterToken": "推特登录token",
"discordToken": "discord登录token",
"userAgent":"用户配置的浏览器userAgent信息",
"language":"用户配置的浏览器language信息",
"webglVendor":"用户配置的浏览器webglVendor信息",
"webglRenderer":"用户配置的浏览器webglRenderer信息",
},...
],
"config":{
"default":{"默认配置"},
"0x1234..5678":{"当0x1234..5678===wallets.address时，使用该配置替换default中的配置"},
...
},
"time": "2024/3/15 17:56:11"
}- 任务日志消息，用于显示任务进度的消息，工具箱收到消息后会展示在用户前端
{
"type": "task_log",
"message": "任务日志信息"
}- 任务终止信息，由用户在工具箱客户端发出，进程接收到消息后需要主动结束任务
{
"type": "task_terminate"
}- 任务完成信息，任务结束后需要发送任务结束消息，工具箱收到消息后会关闭进程
{
"type": "task_completed"
}- 任务报错信息，任务执行出错后将出错信息回传客户前端
{
"type": "task_error",
"message": "错误信息"
}通过调用 ws.send 方法向工具箱发送消息。
ws.send(JSON.stringify({type: 'task_completed'}));通过监听 message 事件接收工具箱发送的消息。
ws.on('message', function incoming(data) {
console.log(data);
});V0.1.2 调整脚本配置功能，实现不同钱包可拥有独立配置,脚本配置格式目前支持input和select两种，以下为脚本配置格式
{
"testInput": {"type":"input", "text":"测试输入框"},
"testSelect": {"type":"select", "options": [
{"value":"test1", "text":"选择框1"},
{"value":"test2", "text":"选择框2"},
{"value":"test3", "text":"选择框3"}
], "defaultValue":"test2"}
}例如用户通用配置的测试输入框的输入内容"测试1"，选择"选择框3"后，请求数据将收到以下信息
{
...,
"config":{
"default":{
"testInput":"测试1",
"testSelect":"选择框3"
}
}
}如果在使用中遇到问题，进入discord @Aming 点击进入社区