前言
遇到了一个需求，想要扫码后，进入微信小程序的某一个页面，这就要求二维码携带参数。
微信小程序开发文档很简单，但不太具体。
经百度和折腾，在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?grant_type=client_credential&appid=${appid}&secret=${secret}` axios.get(url).then(res2=>{ //access_token就在res2中 let access_token = res2.data.access_token; //待继续补充区域 }); } catch (error) { console.log(error) }})export default qrcode; 拿到了access_token接口凭证了，继续下一步。
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?grant_type=client_credential&appid=${appid}&secret=${secret}` axios.get(url).then(res2=>{ let scene = req.body._id;//开发者自己自定义的参数 axios( { headers:{"Content-type":"application/json"}, method: 'post', responseType: 'arraybuffer', url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token='+access_token+'', data:{ scene:scene, page:'pages/infor/main', width: 280 } } ).then(res3=>{ //请求到的二维码buffer就在res3中 //待完善区域 }) }); } catch (error) { console.log(error) }})export default qrcode; 第二次axios请求，用option配置的方式，设置了responseType，避开了第二个坑。二维码的buffer数据就在res3中。
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?grant_type=client_credential&appid=${appid}&secret=${secret}`; axios.get(url).then(res2=>{ let access_token = res2.data.access_token; let scene = req.body._id; axios( { headers:{"Content-type":"application/json"}, method: 'post', responseType: 'arraybuffer', url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token='+access_token+'', data:{ scene:scene, page:'pages/infor/main', width: 280 } } ).then(res3=>{ let src = path.dirname(__dirname).replace(////g,'/')+`/public/photo/${req.body._id}.png`; fs.writeFile(src, res3.data, function(err) { if(err) {console.log(err);} res.json({msg:ok}); }); }) }); } catch (error) { console.log(error); res.json({error}) }})export default qrcode; 就会在根目录下的public/photo文件夹中生成制定名称的二维码图片。供小程序访问调用。
后记
获取二维码后，可以在前端利用canvas进行图片绘制，也可以在后端生成图片。可根据业务需求自行选择。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持VeVb武林网。
注：相关教程知识阅读请移步到JavaScript/Ajax教程频道。
