1. 首页
  2. 标签
  3. Javascript
【Web3项目案例】Ethers.js极简入门＋实战案例：实现ERC20协议代币查询、交易
System
2024-08-10
所有,javascript



// 引入Ethers.js库
const { ethers } = require('ethers');
 
// 假设已经有了Infura的URL和Project ID
const INFURA_URL = 'https://mainnet.infura.io/v3/YOUR_INFURA_PROJECT_ID';
 
// 创建Ethers.js的Provider实例
const provider = new ethers.providers.JsonRpcProvider(INFURA_URL);
 
// 地址
const address = '0x0000000000000000000000000000000000000000';
 
// 查询ERC20代币的总供应量
async function getTokenTotalSupply(address) {
  const contract = new ethers.Contract(address, ['function totalSupply() view returns (uint256)'], provider);
  const totalSupply = await contract.totalSupply();
  console.log('Total supply:', totalSupply.toString());
}
 
// 查询特定地址的ERC20代币余额
async function getTokenBalance(address, tokenAddress) {
  const contract = new ethers.Contract(tokenAddress, ['function balanceOf(address) view returns (uint256)'], provider);
  const balance = await contract.balanceOf(address);
  console.log('Balance:', balance.toString());
}
 
// 查询代币的名称
async function getTokenName(address, tokenAddress) {
  const contract = new ethers.Contract(tokenAddress, ['function name() view returns (string)'], provider);
  const name = await contract.name();
  console.log('Name:', name);
}
 
// 查询代币的符号
async function getTokenSymbol(address, tokenAddress) {
  const contract = new ethers.Contract(tokenAddress, ['function symbol() view returns (string)'], provider);
  const symbol = await contract.symbol();
  console.log('Symbol:', symbol);
}
 
// 查询代币的小数位数
async function getTokenDecimals(address, tokenAddress) {
  const contract = new ethers.Contract(tokenAddress, ['function decimals() view returns (uint8)'], provider);
  const decimals = await contract.decimals();
  console.log('Decimals:', decimals.toString());
}
 
// 执行查询
getTokenTotalSupply('0x86fa049857e0209aa7d9e616f7eb3b3b78ecfdb0'); // 以DAI代币地址为例
getTokenBalance(address, '0x86fa049857e0209aa7d9e616f7eb3b3b78ecfdb0');
getTokenName(address, '0x86fa049857e0209aa7d9e616f7eb3b3b78ecfdb0');
getTokenSymbol(address, '0x86fa049857e0209aa7d9e616f7eb3b3b78ecfdb0');
getTokenDecimals(address, '0x86fa049857e0209aa7d9e616f7eb3b3b78ecfdb0');

这段代码使用Ethers.js库连接到以太坊的Infura节点，并展示了如何查询一个ERC20代币的总供应量、特定地址的余额、名称、符号和小数位数。这是一个简单的以太坊去中心化应用（dApp）的入门级例子，展示了如何在前端或服务器端使用Ethers.js进行基本的区块链和代币信息查询。

- 阅读更多 -
Quagga.js: 实时视频流中的条形码和二维码识别
System
2024-08-10
所有,javascript

Quagga.js 是一个JavaScript库，用于在实时视频流中对条形码和二维码进行识别。以下是一个简单的例子，展示如何使用Quagga.js来识别视频流中的条形码和二维码：




<!DOCTYPE html>
<html>
<head>
    <title>Quagga.js Barcode Detection</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/quagga/0.12.1/quagga.min.js"></script>
</head>
<body>
    <video id="video" width="500" height="300" autoplay></video>
    <script>
        var video = document.getElementById('video');
 
        Quagga.init({
            inputStream : {
                name : 'live',
                type : 'LiveStream',
                target: '#video', // Or '#yourElement' for jQuery compatibility
                fps: 20, // Frames per second
                endStreamAfterFra: 0 // Just stream forever
            },
            decoder : {
                readers : ['code_128_reader', 'ean_reader', 'ean_8_reader', 'code_39_reader', 'code_39_vin_reader', 'codabar_reader', 'upc_reader', 'upc_e_reader', 'i2of5_reader', '2of5_reader', 'pdf417_reader']
            }
        }, function(err) {
            if (err) {
                console.log(err);
                return;
            }
            console.log("Initialization finished. Ready to start");
            Quagga.start();
        });
 
        Quagga.onDetected(function(data) {
            console.log("Barcode detected", data);
            Quagga.stop();
        });
    </script>
</body>
</html>

这段代码首先引入了Quagga.js库，然后初始化Quagga，指定视频流源和需要识别的编码器。之后，当条形码或二维码被检测到时，它会在控制台输出结果，并停止视频流的解析。这个例子提供了一个基本框架，您可以根据自己的需求进行扩展和调整。

- 阅读更多 -
npm : 无法加载文件 D: odejs ode_global pm.ps1，因为在此系统上禁止运行脚本。
System
2024-08-10
所有,javascript

报错信息 "npm : 无法加载文件 D:" 可能是因为你尝试执行了一个 npm 命令，并且提供了一个路径参数，但是这个路径不完整或者不正确。

解决方法：

  1. 确认你执行的 npm 命令及其相关的路径参数是否正确。例如，如果你正在尝试安装位于特定目录的 npm 包，确保你提供的路径是正确的。
  2. 如果你正在尝试安装全局包，确保你使用了正确的命令。全局安装通常不需要指定路径，可以直接使用 npm install -g <包名>。
  3. 如果你正在尝试安装项目依赖，确保你已经在项目的根目录下执行命令，并且路径参数是可选的。
  4. 检查你的 npm 配置，确保没有错误的全局安装路径或者缓存路径。你可以使用 npm config list 来查看当前的配置。
  5. 如果报错信息是因为路径不存在或者不正确，请提供正确的路径或者执行命令。

如果以上步骤无法解决问题，请提供更详细的错误信息或者上下文，以便进一步诊断问题。

- 阅读更多 -
其他内容：NodeJS 中的 Socket.io
System
2024-08-10
所有,javascript

Socket.IO 是一个基于事件的实时通信引擎，用于在浏览器和服务器之间实现高效的双向通信。它支持不同的通信传输方式，例如 WebSocket、AJAX 轮询等，自动根据浏览器支持情况选择最优的通信方式。

以下是一个使用 NodeJS 和 Socket.IO 创建简单聊天室应用的例子：

服务器端代码 (server.js):




const http = require('http');
const socketIO = require('socket.io');
 
const server = http.createServer((req, res) => {
  res.end('Chat server is running.');
});
 
const io = socketIO(server);
 
io.on('connection', (socket) => {
  console.log('A user has connected.');
 
  socket.on('disconnect', () => {
    console.log('A user has disconnected.');
  });
 
  socket.on('chat message', (msg) => {
    console.log('Message: ' + msg);
    // Broadcast the message to all connected sockets
    io.emit('chat message', msg);
  });
});
 
server.listen(3000, () => {
  console.log('Server is running on port 3000');
});

客户端代码 (index.html):




<!DOCTYPE html>
<html>
<head>
  <title>Chat Room</title>
</head>
<body>
  <h1>Chat Room</h1>
  <div id="messages"></div>
  <input id="m" type="text" />
  <button onclick="sendMessage()">Send</button>
 
  <script src="/socket.io/socket.io.js"></script>
  <script>
    const socket = io();
    const messages = document.getElementById('messages');
    const input = document.getElementById('m');
 
    socket.on('chat message', (msg) => {
      messages.innerHTML += '<p>' + msg + '</p>';
    });
 
    function sendMessage() {
      const msg = input.value;
      socket.emit('chat message', msg);
      input.value = '';
    }
  </script>
</body>
</html>

在服务器端，我们创建了一个 HTTP 服务器并初始化了 Socket.IO。当客户端连接时，我们监听 'connection' 事件，并在收到 'chat message' 事件时，将消息广播给所有连接的客户端。

在客户端，我们连接到服务器并监听 'chat message' 事件以接收消息。当用户输入消息并点击按钮时，我们发送 'chat message' 事件，服务器端会处理并广播这条消息。

- 阅读更多 -
使用Nodejs和Langchain开发大模型
System
2024-08-10
所有,javascript

以下是一个使用Node.js和Langchain创建一个简单的与大型语言模型交互的示例代码。在这个例子中，我们将使用@llama-js/llama模块，它是Langchain的一个部分，用于与大型语言模型交互。

首先，确保你已经安装了Node.js和npm。然后，你需要安装Langchain库：




npm install @llama-js/llama

以下是一个简单的Node.js脚本，它使用Langchain与大型语言模型交互：




const { Llama } = require('@llama-js/llama');
 
async function main() {
    // 创建一个llama实例，这里我们使用的是gpt-3.5-turbo
    const llama = new Llama({
        apiKey: 'YOUR_OPENAI_API_KEY', // 替换为你的OpenAI API 密钥
        model: 'gpt-3.5-turbo', // 可以指定模型，也可以省略使用默认模型
    });
 
    // 使用llama生成文本
    const response = await llama.complete({
        prompt: "给我一首我喜欢的歌曲的歌词", // 提示信息
        maxTokens: 100 // 最大令牌数，即生成文本的最大字符数
    });
 
    // 输出生成的歌词
    console.log(response.completion.text);
}
 
main().catch(console.error);

在这个例子中，我们创建了一个Llama实例，并使用它的complete方法来生成歌词。你需要替换YOUR_OPENAI_API_KEY为你的OpenAI API 密钥。

这只是一个简单的示例，Langchain和@llama-js/llama提供了更多功能，如使用多个模型、处理不同类型的输入和输出、管理模型的API密钥等。

- 阅读更多 -
js 判断数据是不是{}
System
2024-08-10
所有,javascript

在JavaScript中，要判断一个数据是否是空对象{}，可以通过检查该对象的Object.keys()方法返回的数组长度是否为0来实现。如果长度为0，则该对象是空的。

示例代码如下：




function isEmptyObject(obj) {
  return Object.keys(obj).length === 0 && obj.constructor === Object;
}
 
// 测试
const obj1 = {};
const obj2 = { key: 'value' };
 
console.log(isEmptyObject(obj1)); // 输出: true
console.log(isEmptyObject(obj2)); // 输出: false

这个函数isEmptyObject接收一个参数obj，检查它是否满足以下条件：

  1. Object.keys(obj).length === 0：确保对象没有任何可枚举的自身属性。
  2. obj.constructor === Object：确保这个对象是一个普通对象，而不是其他类型的对象（如数组）的实例。
- 阅读更多 -
解锁layer.js秘籍：6大神器方法带你玩转弹窗艺术
System
2024-08-10
所有,javascript

Layer.js 是一个web弹窗UI库，它提供了多种弹窗样式和交互方式，以下是使用Layer.js弹窗的基本方法：

  1. 使用layer.open方法打开一个基本的弹窗：



layer.open({
  type: 1, 
  content: 'Hello World!'
});
  1. 使用layer.msg显示一条消息提示：



layer.msg('操作成功！');
  1. 使用layer.alert显示一个警告框：



layer.alert('警告内容', {icon: 2});
  1. 使用layer.confirm显示一个确认框：



layer.confirm('确认要执行此操作吗？', {icon: 3, title:'提示'}, function(index){
  // 确认操作的代码
  layer.close(index);
});
  1. 使用layer.load显示加载层：



var index = layer.load(1, {shade: [0.1,'#fff']}); //0.1透明度的白色背景
  1. 使用layer.iframe在弹窗中加载一个iframe：



layer.open({
  type: 2, 
  content: 'http://sentsin.com',
  area: ['1000px', '500px']
});

以上代码示例展示了Layer.js库中的一些基本用法。Layer.js提供了丰富的API和多种弹窗样式，可以根据实际需求选择合适的方法和参数。

- 阅读更多 -
nodejs 定时任务的执行 node-cron node-schedule
System
2024-08-10
所有,javascript

在Node.js中，你可以使用node-cron和node-schedule这两个包来实现定时任务。

node-cron使用类似于crontab的语法来设置定时任务，而node-schedule提供了更加灵活的定时任务设置。

以下是使用node-cron和node-schedule的示例代码：

使用node-cron:




const cron = require('node-cron');
 
// 每分钟执行一次
cron.schedule('* * * * *', () => {
  console.log('执行定时任务');
});

使用node-schedule:




const schedule = require('node-schedule');
 
// 每分钟执行一次
const job = schedule.scheduleJob('*/1 * * * *', () => {
  console.log('执行定时任务');
});
 
// 取消任务
// job.cancel();

node-cron更适合简单的定时任务，而node-schedule提供了更多的定时策略和选项，如间隔执行、指定开始时间等。根据你的需求选择合适的包。

- 阅读更多 -
nodejs版本过高导致vue-cli无法启动的解决方案
System
2024-08-10
所有,javascript

报错问题解释：

在Node.js版本过高的情况下，可能会导致使用较旧版本的vue-cli创建的项目无法正常启动，因为项目依赖的某些包可能不支持新版本的Node.js。

解决方法：

  1. 降低Node.js版本：可以使用nvm（Node Version Manager）来管理和切换不同版本的Node.js。

    安装nvm：

    


curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
# 或者
wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

    安装特定版本的Node.js：

    


nvm install <version>

    切换到特定版本：

    


nvm use <version>

    列出所有已安装的版本：

    


nvm ls

  2. 升级vue-cli：如果不想降低Node.js版本，可以尝试升级vue-cli到最新版本，以支持当前Node.js版本。

    使用npm升级vue-cli：

    


npm update -g @vue/cli
  3. 检查项目依赖：确保项目中使用的所有依赖项也支持当前的Node.js版本。如果有必要，更新项目依赖或者寻找替代的包。

  4. 使用.node-version文件：在项目根目录下创建.node-version文件，指定Node.js的版本。

    文件内容：

    


<version>

    这可以在使用nvm时帮助切换到正确的Node.js版本。

在实施上述解决方案时，请确保测试项目能否在新的环境中正常运行。如果项目依赖于某些已弃用的Node.js特性，可能需要进行相应的修改。

- 阅读更多 -
安装 Nuxt.js 的步骤和注意事项
System
2024-08-10
所有,javascript

要安装 Nuxt.js，请遵循以下步骤：

  1. 确保你的开发环境已安装了Node.js和npm。
  2. 打开终端或命令提示符。
  3. 创建一个新的Nuxt.js项目或者安装到现有项目中。

如果是创建新项目，请运行：




npx create-nuxt-app <项目名>

然后按照终端中的指示进行操作。

如果是安装到现有项目中，请运行：




npm install nuxt

或者使用yarn：




yarn add nuxt

注意事项：

  • 确保你使用的是与项目兼容的Nuxt.js版本。
  • 如果你的项目需要特定版本的Nuxt.js，可以在package.json中指定版本，然后运行npm install或yarn来安装。
  • 安装过程中可能会遇到权限问题，如果是这样，请使用sudo（对于Unix-like系统）或以管理员身份运行命令提示符（对于Windows）。
  • 如果你的网络环境不稳定，可能需要配置npm的镜像源，例如使用淘宝镜像。
- 阅读更多 -
Copyright © 2025 Tech Blog
All Right Reserved | 京ICP备19053165号