吐槽:某厂的开发文档写的跟屎一样
uni.request({ url: 'https://api.weixin.qq.com/wxa/getwxacodeunlimit?access_token=' + res.data.accessToken, method: 'POST', headers: { 'Content-Type': 'json' }, responseType: 'arraybuffer', data: { "scene": "a=1", // 参数 "is_hyaline": true //透明底色 }, success: (res) => { // 将返回的图片buffer生成图片,并保存至临时用户文件中 const fs = wx.getFileSystemManager(); const FILE_BASE_NAME = 'code'; let filePath = `${wx.env.USER_DATA_PATH}/${FILE_BASE_NAME}.png`; fs.writeFileSync(filePath, res.data) // filePath就是图片的本地路径 that.filePath = filePath that.qrcode(filePath) }, fail(e) { console.log(e) } });
let that = this const query = wx.createSelectorQuery() query.select('#myCanvas') .fields({ node: true, size: true }) .exec((res) => { const canvas = res[0].node const ctx = canvas.getContext('2d') const headerImg = canvas.createImage(); const backImg = canvas.createImage(); headerImg.src = that.filePath; backImg.src = '../../static/wish.png'; backImg.onload = () => { ctx.drawImage(backImg, 0, 0, 150, 100) } headerImg.onload = () => { ctx.drawImage(headerImg, 0, 0, 150, 100) } })
// 创建离屏 2D canvas 实例 const canvas = wx.createOffscreenCanvas({ type: '2d', width: 300, height: 150 }) // 获取 context。注意这里必须要与创建时的 type 一致 const context = canvas.getContext('2d') // 创建一个图片 const image = canvas.createImage() // 等待图片加载 image.src = '../../static/wish.png' // 要加载的图片 url image.onload = () => { // 把图片画到离屏 canvas 上 context.clearRect(0, 0, 300, 150) context.drawImage(image, 0, 0, 300, 150) // 获取画完后的数据 const imgData = context.getImageData(0, 0, 300, 150) console.log(imgData) // 图片的base64格式 console.log(context.canvas.toDataURL()) that.src = context.canvas.toDataURL() }