一键生成uniapp小程序二维码，转化图片so easy！

前端

2023-11-10 17:32:32

轻松生成 UniApp 小程序二维码，一劳永逸！

作为一名 UniApp 开发者，生成小程序二维码并将其转换为图片的需求是常见的任务。虽然这可能是一项繁琐的任务，但有一个快速有效的解决方案可以让你轻松实现。在这个指南中，我们将带你一步步完成这个过程，让你轻松创建并保存二维码图片。

准备工作：

在开始之前，确保以下准备工作就绪：

安装了微信开发者工具。
已获取小程序的 appid 和 appsecret。

步骤指南：

1. 创建 weapp-qrcode.js 文件

首先，你需要创建名为 weapp-qrcode.js 的文件，并复制以下代码：

const QRCode = require('qrcode')

function generateQRCode(data, options) {
  return new Promise((resolve, reject) => {
    QRCode.toDataURL(data, options, (err, url) => {
      if (err) {
        reject(err)
      } else {
        resolve(url)
      }
    })
  })
}

function saveImageToAlbum(url) {
  wx.downloadFile({
    url: url,
    success: function (res) {
      wx.saveImageToPhotosAlbum({
        filePath: res.tempFilePath,
        success: function (res) {
          wx.showToast({
            title: '保存成功',
            icon: 'success',
            duration: 2000
          })
        }
      })
    }
  })
}

module.exports = {
  generateQRCode,
  saveImageToAlbum
}

2. 引入 weapp-qrcode.js

在小程序的 app.js 文件中，引入刚刚创建的 weapp-qrcode.js 文件：

const weappQrcode = require('./weapp-qrcode.js')

3. 生成二维码

使用 weappQrcode.generateQRCode() 方法生成二维码。该方法接受两个参数：

data：要编码为二维码的数据。它通常是一个 JSON 字符串，包含小程序的 appid 和 appsecret。
options：可用于自定义二维码外观的可选选项。

例如：

const data = '{"appid": "your_appid", "appsecret": "your_appsecret"}'
const options = {
  type: 'image/png',
  width: 200
}
weappQrcode.generateQRCode(data, options).then(res => {
  // res 是生成的二维码的 URL
}).catch(err => {
  // 处理错误
})