express启用https小记

标签:启用,小记 发布时间:2019年09月16日 点击5

前言

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

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

经百度和折腾,在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.qq3564/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.qq3564/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.qq3564/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.qq3564/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.qq3564/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进行图片绘制,也可以在后端生成图片。可根据营业需求自行选择。

盼望对有必要的同伙能够有帮助。


相关链接
联络方式:

中国 · 北京
电话:4000-960-360
企业QQ:800-118-118
邮箱:800118118@b.qq.com

手机网站建设