• 作者:老汪软件技巧
  • 发表时间:2024-08-18 17:04
  • 浏览量:

使用 node.js 的web框架 express.js 生成不限制的微信小程序码

在 Node.js 中生成微信小程序码通常涉及到与微信官方 API 的交互。微信提供了生成小程序码的接口,这些码可以用于打开特定的小程序页面或者带有参数的页面。以下是一个简单的步骤指南和示例代码来说明如何使用 Node.js 生成微信小程序码。

准备工作1、注册并创建小程序:2、安装依赖:生成小程序码步骤:1、获取 Access Token:通过调用微信的 API 接口获取 Access Token 接口说明。2、生成小程序码:使用 Access Token 调用生成小程序码的接口 接口说明。示例代码

首先确保安装了必要的 npm 包:

npm install express axios cors

1、获取 Access Token

/**
 * 获取 Access Token
 * @param {string} appid 小程序appid
 * @param {string} secret 小程序secret
 * @returns access_token 
 */
async function getAccessToken(appid, secret) {
  // 获取接口调用凭据 接口英文名叫getAccessToken
  // 官方说明地址:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/mp-access-token/getAccessToken.htm
  const url = `https://api.weixin.qq.com/cgi-bin/token`;
  const response = await axios({
    method: "get",
    url,
    params: {
      grant_type: 'client_credential',
      appid,
      secret,
    },
  });
  if (response.data?.errcode) {
    throw new Error(JSON.stringify(response.data))
  }
  return response.data.access_token;
}

2、生成小程序码

/**
 * 生成小程序码
 * @param {String} access_token access_token
 * @param {Object} data 全部参数请查看:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/qrcode-link/qr-code/getUnlimitedQRCode.html#%E8%AF%B7%E6%B1%82%E5%8F%82%E6%95%B0
 * @returns 图片 Buffer
 */
async function generateWxaCodeUnlimited(access_token, data) {
  // 获取不限制的小程序码 接口英文名 getUnlimitedQRCode
  // 官方说明地址:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/qrcode-link/qr-code/getUnlimitedQRCode.html
  const url = `https://api.weixin.qq.com/wxa/getwxacodeunlimit`;
  const response = await axios({
    method: "post",
    url,
    data,
    params: {
      access_token,
    },
    responseType: "arraybuffer",
  });
  if (response.data?.errcode) {
    throw new Error(JSON.stringify(response.data))
  }
  return response.data
}

3、将 buffer 转换为文件

/**
 * 将buffer转换为文件
 * @param {Buffer} buffer buffer
 * @param {String} savePath 要保存的路径
 * @param {String} filename 文件名称
 * @returns 返回保存的文件路径
 */
async function bufferToFile(buffer, savePath, filename) {
  // 写入文件
  fs.writeFile(`.${savePath + filename}`, buffer, (err) => {
    if (err) {
      throw new Error(err);
    }
  });
  console.log('Image saved successfully', `Image saved as ${savePath + filename}`);
  return savePath + filename
}

4、将 buffer 转换为 Base64

微信小程序代码包限制_小程序代码限制_

/**
 * 将 buffer 转换为 Base64
 * @param {Buffer} buffer buffer
 * @returns 
 */
function bufferToBase64(buffer) {
  const base64 = `data:image/jpeg;base64,${buffer.toString('base64')}`
  return base64
}

5、设置路由处理函数,用于生成小程序码


// 设置路由处理函数,用于生成小程序码
app.get('/getCode', async (req, res) => {
  // 打印请求查询参数
  console.log('req', req.query);
  // 替换为你的场景值
  const { scene = 'your_scene' } = req.query
  // 获取 Access Token
  const access_token = await getAccessToken(wxConfig.appid, wxConfig.secret);
  // 生成小程序码
  const buffer = await generateWxaCodeUnlimited(access_token, { ...req.query, scene });
  // 将buffer转换为文件
  const fileUrl = await bufferToFile(buffer, '/public/', `wxa_code_unlimited_${scene}.png`);
  // 将 buffer 转换为 Base64 字符串
  const base64 = bufferToBase64(buffer);
  res.send({// 响应结果
    path: `http://${req.hostname}:${port}${fileUrl}`, // 返回图片的路径
    base64: base64, // 返回 Base64 字符串
  }).json();
})

6、请求接口测试

$ # GET to /getCode
$ curl "http://localhost:3000/getCode?scene=864910436"
$ # result -> {
  #  "path":"http://localhost:3000/public/wxa_code_unlimited_864910436.png",
  #  "base64":"data:image/jpeg;base64,eyJlcnJjb03N2NhNGUzNyJ9"
  # }

7、前端小程序测试

// pages/test.js
// 官方说明地址 https://developers.weixin.qq.com/miniprogram/dev/api/device/scan/wx.scanCode.html
wx.scanCode({
  success (res) {
    console.log(res)
    // 扫码成功返回的结果为:
    // res {
    //   "charSet": "utf-8", 
    //   "result": "", 
    //   "path": "pages/index?scene=864910436", 
    //   "codeVersion": 0, 
    //   "errMsg": "scanCode:ok", 
    //   "rawData": "bDJQQjlPekJtKkt2UGtYJGlYJiFrYzM2", 
    //   "scanType": "WX_CODE"
    // }
    wx.navigateTo({
      url: res.path,
    })
  }
})
// pages/index.js
Page({
  onLoad (query) {
    // scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
    const scene = decodeURIComponent(query.scene)
    console.log(scene) // 864910436
  }
})

完整代码

// index.js
const express = require('express'); // 导入 Express 模块
const cors = require('cors'); // 导入 CORS 模块,用于处理跨域请求
const axios = require('axios'); // 导入 Axios 模块,用于发起 HTTP 请求
const fs = require("fs"); // 导入 Node.js 的 fs 模块,用于文件系统操作
const app = express(); // 创建 Express 应用实例
app.use(cors()); // 使用 CORS 中间件解决跨越请求
const port = 3000; // 设置应用监听的端口号
// 配置静态文件服务,使得/public路径下的文件可以直接访问,如果没有请手动创建
app.use('/public', express.static('public')); 
const wxConfig = {// 微信小程序配置信息
  appid: 'your_appid',// 替换为你的 AppID
  secret: 'your_secret',// 替换为你的 AppSecret
}
// 设置路由处理函数,用于生成小程序码
app.get('/getCode', async (req, res) => {
  console.log('req', req.query); // 打印请求查询参数
  // 替换为你的场景值
  const { scene = 'your_scene' } = req.query
  // 获取 Access Token
  const access_token = await getAccessToken(wxConfig.appid, wxConfig.secret);
  // 生成小程序码
  const buffer = await generateWxaCodeUnlimited(access_token, { ...req.query, scene });
  // 将buffer转换为文件
  const fileUrl = await bufferToFile(buffer, '/public/', `wxa_code_unlimited_${scene}.png`);
  // 将 buffer 转换为 Base64 字符串
  const base64 = bufferToBase64(buffer);
  res.send({// 响应结果
    path: `http://${req.hostname}:${port}${fileUrl}`, // 返回图片的路径
    base64: base64, // 返回 Base64 字符串
  }).json();
})
/**
 * 获取 Access Token
 * @param {string} appid 小程序appid
 * @param {string} secret 小程序secret
 * @returns access_token 
 */
async function getAccessToken(appid, secret) {
  // 获取接口调用凭据 接口英文名叫getAccessToken
  // 官方说明地址:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/mp-access-token/getAccessToken.htm
  const url = `https://api.weixin.qq.com/cgi-bin/token`;
  const response = await axios({
    method: "get",
    url,
    params: {
      grant_type: 'client_credential',
      appid,
      secret,
    },
  });
  if (response.data?.errcode) {
    throw new Error(JSON.stringify(response.data))
  }
  return response.data.access_token;
}
/**
 * 生成小程序码
 * @param {String} access_token access_token
 * @param {Object} data 全部参数请查看:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/qrcode-link/qr-code/getUnlimitedQRCode.html#%E8%AF%B7%E6%B1%82%E5%8F%82%E6%95%B0
 * @returns 图片 Buffer
 */
async function generateWxaCodeUnlimited(access_token, data) {
  // 获取不限制的小程序码 接口英文名 getUnlimitedQRCode
  // 官方说明地址:https://developers.weixin.qq.com/miniprogram/dev/OpenApiDoc/qrcode-link/qr-code/getUnlimitedQRCode.html
  const url = `https://api.weixin.qq.com/wxa/getwxacodeunlimit`;
  const response = await axios({
    method: "post",
    url,
    data,
    params: {
      access_token,
    },
    responseType: "arraybuffer",
  });
  if (response.data?.errcode) {
    throw new Error(JSON.stringify(response.data))
  }
  return response.data
}
/**
 * 将 buffer 转换为文件
 * @param {Buffer} buffer buffer
 * @param {String} savePath 要保存的路径
 * @param {String} filename 文件名称
 * @returns 返回保存的文件路径
 */
async function bufferToFile(buffer, savePath, filename) {
  // 写入文件
  fs.writeFile(`.${savePath + filename}`, buffer, (err) => {
    if (err) {
      throw new Error(err);
    }
  });
  console.log('Image saved successfully', `Image saved as ${savePath + filename}`);
  return savePath + filename
}
/**
 * 将 buffer 转换为 Base64
 * @param {Buffer} buffer buffer
 * @returns 
 */
function bufferToBase64(buffer) {
  const base64 = `data:image/jpeg;base64,${buffer.toString('base64')}`
  return base64
}
// 监听端口
app.listen(port, () => {
  console.log(`Example app listening on port ${port}`, `is open url http://127.0.0.1:${port}`)
})

注意事项

替换 your_appid, your_secret 为你的实际值。以上就是使用 Node.js 生成不限制数量的微信小程序码的过程。你可以根据具体需求调整参数和处理逻辑。


上一条查看详情 +Flutter开发--异步编程
下一条 查看详情 +没有了