最近在做毕设，有一个获取小程序码绘制分享海报的需求，因为需要小程序码的数量较多的业务场景，所以只能采用后端生成返回给前端调用或者云开发调用。

生成小程序码的两种方式

HTTPS调用

需要后端生成返回给前端，这个方法在本文不做赘述

云函数调用

思路：

小程序端请求 --> 云函数API --> 返回图片的buffer --> 把buffer转化成图片

1.新建云函数

在 cloudfunction目录右键新建Node.js云函数 getQRCode

生成小程序码需要单独指定权限。在 getQRCode目录新建 config.json ，里面写以下内容：

{"permissions": {"openapi": ["wxacode.getUnlimited"]}
}

小程序码的获取方式有三种，这里只用到了接口 getUnlimited

2.云函数getQRCode的js部分

直接贴代码

// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
exports.main = async (event, context) => {try {const result = await cloud.openapi.wxacode.getUnlimited({scene: event.scene, //但是新版本不能使用path传参paramwidth: 300})console.log(result)return result} catch (err) {console.log(err)return err}
}

直接调用，比服务端调用少了 access_token 参数

返回值是二进制的buffer流，将buffer转化即可展示图片内容

3.转化buffer流成图片的三种方法

3.1 直接将buffer转化Base64

console.log('云函数调用成功返回值：', res);
let bufferImg = "data:image/png;base64," + wx.arrayBufferToBase64(res.result.buffer);
self.setData({imgUrl: bufferImg
});

这里用到的方法是 wx.arrayBufferToBase64(buffer)转化，加好base64头，即可使用

优点: 方便简单
确定: 阅后即焚，无法保存，个别场景可能需要缓存或者拼接canvas海报

3.2 在云函数直接将Buffer上传到云存储

await cloud.uploadFile({cloudPath: 'test/' + event.userInfo.openId  + '.jpg', //这里如果可以重复就用openId，如果不可能重复就用 fileContent: result.buffer, //处理buffer 二进制数据success: res => {// 文件地址console.log(res.fileID)},fail: err =>{console.log(err)}
})

将生成的小程序码上传到自带的云存储上，可以长期永久保存

优点: 长期保存，合适只要生成一次反复使用的场景
缺点: 生成量大的话，比较占用有限云存储资源

3.3 将图片转化保存在手机本地

let { buffer } = res.result;
const wxFile = wx.getFileSystemManager();
const filePath = wx.env.USER_DATA_PATH + '/test.jpg';
//把图片写在本地
wxFile.writeFile({filePath,encoding: "binary",data: buffer,success: res => {console.log(res);  //writeFile:okself.setData({imgUrl: filePath});}
})

这里用到的是wx.getFileSystemManager()的方法，将图片buffer转化后保存一个本地地址~

优点: 生成实体地址，有时候图片太大，base64会出现一些诡异的BUG
缺点: 耗时

4.具体页面部分

Page({data: {imgUrl: "" //图片地址},getWxacode() {wx.cloud.init();let self = this;wx.showLoading({title: '请求云函数'})// 调用云函数 获取内容wx.cloud.callFunction({name: 'getQRCode',data: {scene: "id=666"},success: res => {console.log('云函数调用成功', res);self.setData({imgUrl: res.result.fileID});},fail: err => {console.error('云函数调用失败', err)}})},
})

最后采用的是将buffer上传到云存储的方案

微信小程序利用云函数获取小程序码(二维码) 将buffer流转换为图片相关推荐

今日小程序推荐：香蕉打码-二维码随意生成
2019独角兽企业重金招聘Python工程师标准>>> 最近小编在处理公众号的事项时发现想要DIY二维码,本来想生成动态的,发现有点难度,就找到了小程序,其中有一款小程序可以生成静态 ...
C# 利用ZXing.Net来生成条形码和二维码
本文是利用ZXing.Net在WinForm中生成条形码,二维码的小例子,仅供学习分享使用,如有不足之处,还请指正. 什么是ZXing.Net? ZXing是一个开放源码的,用Java实现的多种格式的 ...
利用xposed自动获得支付宝个人收款二维码链接和收款记录
一.说明现在的App一般都会带有支付功能,而现在比较流行的支付一般有支付宝.微信.银行卡等,一般情况下,应用开发者会直接对接支付宝.微信或者第三方支付公司的Api,以完成支付,但是都需要收取不小的费 ...
STM32F407获取OV7670摄像头图像及上位机解码（一维码二维码）
STM32F407获取OV7670摄像头图像及上位机解码(一维码&二维码) 1. 目的针对静止拍摄图像场景,实现STM32F407对30万像素OV7670摄像头进行图像捕获,并通过串口将数据 ...
STM32H750获取OV7670摄像头图像及上位机解码（一维码二维码）
STM32H750获取OV7670摄像头图像及上位机解码(一维码&二维码) 1. 目的针对静止拍摄图像场景,实现STM32H750对30万像素OV7670摄像头进行图像捕获,并通过串口将数据 ...
STM32H750获取OV5640摄像头图像及上位机解码（一维码二维码）
STM32H750获取OV5640摄像头图像及上位机解码(一维码&二维码) 1. 目的针对静止拍摄图像场景,实现STM32H750对500万像素OV5640摄像头进行图像捕获,并通过串口将数 ...
STM32F407获取OV2640摄像头图像及上位机解码（一维码二维码）
STM32F407获取OV2640摄像头图像及上位机解码(一维码&二维码) 1. 目的针对静止拍摄图像场景,实现STM32F407对200万像素OV2640摄像头进行图像捕获,并通过串口将数 ...
STM32H750获取OV2640摄像头图像及上位机解码（一维码二维码）
STM32H750获取OV2640摄像头图像及上位机解码(一维码&二维码) 1. 目的针对静止拍摄图像场景,实现STM32H750对200万像素OV2640摄像头进行图像捕获,并通过串口将数 ...
视频教程-微信公众平台深度开发v2.0第3季——二维码、模板消息-微信开发
微信公众平台深度开发v2.0第3季--二维码.模板消息微信企业号星级会员.10多年软件从业经历,国家级软件项目负责人,主要从事软件研发.软件企业员工技能培训.已经取得计算机技术与软件资格考试(软考) ...

微信小程序利用云函数获取小程序码(二维码) 将buffer流转换为图片