网络编程 
首页 > 网络编程 > 浏览文章

使用express获取微信小程序二维码小记

(编辑:jimmy 日期: 2024/11/28 浏览:3 次 )

前言

遇到了一个需求,想要扫码后,进入微信小程序的某一个页面,这就要求二维码携带参数。

微信小程序开发文档很简单,但不太具体。

经百度和折腾,在express中成功获得了带参数的二维码。

总结以下几步,供参考。

1.express项目中引入http请求工具

为什么要在服务端引入这个工具?因为还需要用这个工具去找微信服务端拿access_token接口凭证,来保证安全。

笔者用的是axios。cmd进入根目录,npm安装。

# npm i axios --save

肯定需要写一个获得二维码的接口。在写这个接口的文件中引入axios即可,接口路由的写法不具体展开介绍。

import express from 'express';
import axios from 'axios'; //引入axios库
let qrcode= express.Router();
qrcode.post('/getQrode',async (req,res)=>{
  try {
    ...
    //待写接口内容区域
  } catch (error) {
    throw error;
  }
})
export default qrcode;

引入了库,定义了路由,也定义了一个post接口。第一步准备完毕。

2.获取access_token

找微信服务端拿access_token,需要用上刚刚引入的axios工具了。

通过官方文档介绍,获取access_token需要三个参数,一个常量grant_type,两个变量分别是appid和secret(注册小程序的时候就会获得)

修改接口即可获得access_token

import express from 'express';
import axios from 'axios';
let qrcode= express.Router();
qrcode.post('/share',async (req,res)=>{
  try {
    let appid = 'wxc********b7a';
    let secret = '2bfa**************e8682';
    let url = `https://api.weixin.qq.com/cgi-bin/token"color: #ff0000">3.获取二维码的二进制数据

阅读文档,得知需要进一步传参,请求微信服务端获取二维码的buffer数据。

需要携带的参数可以写在scene中。其他参数文档中介绍的已经很具体。

然而,这里有两个坑要注意!

第一个坑:access_token参数要写在url中,不然请求后会报未传access_token的错。

第二个坑:要设置响应格式,否则请求回来的buffer数据总是被编译成String字符串,造成文件损坏,就无法转化为正常图片(这个折磨了我好久)

import express from 'express';
import axios from 'axios';
let qrcode = express.Router();
qrcode.post('/share',async (req,res)=>{
  try {
    let appid = 'wxc********b7a';
    let secret = '2bfa**************e8682';
    let url = `https://api.weixin.qq.com/cgi-bin/token"Content-type":"application/json"},
          method: 'post',
          responseType: 'arraybuffer',
          url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit"color: #ff0000">4.用buffer生成图片

只要buffer数据是完整的,就能正确生成二维码。

因为需要生成图片,所以需要引用fs模块和path模块。

import express from 'express';
import axios from 'axios';
import path from 'path';
import fs from 'fs';
let qrcode= express.Router();
qrcode.post('/share',async (req,res)=>{
  try {
    let appid = 'wxc********b7a';
    let secret = '2bfa**************e8682';
    let url = `https://api.weixin.qq.com/cgi-bin/token"Content-type":"application/json"},
          method: 'post',
          responseType: 'arraybuffer',
          url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit"color: #ff0000">后记

获取二维码后,可以在前端利用canvas进行图片绘制,也可以在后端生成图片。可根据业务需求自行选择。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

上一篇:express启用https使用小记
下一篇:小程序server请求微信服务器超时的解决方法
高通和谷歌日前宣布,推出首次面向搭载骁龙的Windows PC的优化版Chrome浏览器。
在对骁龙X Elite参考设计的初步测试中,全新的Chrome浏览器在Speedometer 2.1基准测试中实现了显著的性能提升。
预计在2024年年中之前,搭载骁龙X Elite计算平台的PC将面世。该浏览器的提前问世,有助于骁龙PC问世就获得满血表现。
谷歌高级副总裁Hiroshi Lockheimer表示,此次与高通的合作将有助于确保Chrome用户在当前ARM兼容的PC上获得最佳的浏览体验。