天天看點

雲函數生成小程式某頁面二維碼

一、為什麼要是用雲函數生成小程式二維碼呢。

     是用雲函數生成小程式碼,是可以脫離後端人員的接口,自己來實作的。而且通過一定的封裝調用起來也是蠻友善的。而且這個功能應用的場景還是蠻多的。

二、下面簡單說一下步驟

1、建立雲函數,在函數中填寫程式的appid和秘鑰(下面我會貼上我的代碼)

2.到控制台建立一個名為 

access_token

 的資料集合,用于給 

wx-js-utils

 類庫緩存 

access_token

 的數值。

    代碼中我将生成的二維碼直接放置在雲存儲的qr檔案夾下。(這個可以自己進行)

3.上傳雲函數到伺服器并部署服務

4、頁面直接調用

三、下面貼一下我的代碼詳情

雲端代碼:(雲函數的index.js檔案,需要自行填入秘鑰和appid)

// 雲函數入口檔案
const cloud = require('wx-server-sdk');
const SECRET = "秘鑰",  //小程式的秘鑰
 bucketPrefix ="存放的id";  //其中 bucketPrefix 為檔案存儲 fildID 的前半部分。
// 設定檔案夾名稱 設定名稱加'/'
const filename ="qr/";
// 初始化雲能力
cloud.init()
async function getQR(method, path, fileID) {
  const {
    APPID,
  } = cloud.getWXContext();
  // 字元串的處理
  let filename2 = `${path}_${fileID}`.replace(/\//g, '_');
  filename2 = filename2.replace(/\?/g,'-')

  try {
    await cloud.downloadFile({
      fileID: bucketPrefix + filename + filename2
    })
    console.log('get from cos!!!')

    return { fileID: bucketPrefix + filename + filename2}
  } catch (e) {
    console.log('get cos failed, invoke api generate!')

    const {
      WXMINIUser,
      WXMINIQR
    } = require('wx-js-utils')

    // 擷取access_token
    const wXMINIUser = new WXMINIUser({
      appId: APPID,
      secret: SECRET
    })
    const access_token = await wXMINIUser.getCacheAccessToken()
    console.log('access_token: ', access_token)
    // 生成小程式碼
    const wXMINIQR = new WXMINIQR()
    const qrResult = await wXMINIQR[method]({
      scene: '?code=123',
      access_token,
      path,
      is_hyaline: true
    })
     await cloud.uploadFile({
      cloudPath: filename + filename2,
      fileContent: qrResult
    })

    return { fileID: bucketPrefix + filename + filename2 }
  }
}

/**
 * 根據類型生成對應的二維碼
 * @param {String} type 取值有square,mina,unlimitmina
 */
async function getQRByType(type = 'limit', path ="pages/index/index") {
  switch (type) {
    case 'square':
      return await getQR('getQR', path, 'square.png')
    case 'limit':
      return await getQR('getMiniQRLimit', path, 'limit.png')
    default:
      return await getQR('getMiniQR', path, 'mini.png')
  }
}


// 雲函數入口函數
exports.main = async (event) => await getQRByType(event.type, event.path)
           

頁面的js檔案:

const regeneratorRuntime = require('../../libs/runtime')
Page({

  data: {
    title: 'qrcode',
    step: 1,
    counterId: '',
    openid: '',
    count: null,
    queryResult: '',
  },


  onCreateSquare() {
    this.create('square')  
  },

  onCreateLimit() {
    this.create('limit', "pages/form/register/register?action=modification& openid=oIxZX4zWD2QBU8FDgeaiRbuzo6lA")
  },

  async create(type = 'square', path) {
    wx.showLoading({
      title: '加載中',
    })

    try {
      const res = await wx.cloud.callFunction({
        name: 'wxaqrcode',
        data: {
          type,
          path,
        }
      })
      wx.hideLoading()
      const result = res.result

      if (result.code) {
        wx.showToast({
          title: result.msg,
          icon: 'none'
        })
        return
      }
      this.setData({qrSource: result.fileID})
    } catch (err) {
      wx.hideLoading()
      console.log('err',err)
      wx.showToast({
        title: '生成失敗!',
        icon: 'none',
        duration: 3000
      })
    }
  },
})
           

函數說明:create(),這個函數存在兩個參數,第一個參數是生成二維碼的類型的,第二個是二維碼的路基和參數連接配接,直接編寫即可。如果不傳參的話,目前生成的pages/index/index頁面,并且是無參數的。