背景

在小程序中，可以直接分享小程序到聊天窗口，但是無(wú)法分享小程序到朋友圈，但是朋友圈又是一個(gè)重要的推廣場(chǎng)地，所以分享小程序碼就成了重要途徑。常常被朋友圈刷屏的各種帶有小程序碼的海報(bào)，就是一個(gè)應(yīng)用場(chǎng)景。

普通的分享小程序碼，直接在后臺(tái)放一個(gè)通用的小程序碼就可以了。但是如果需要分享一個(gè)特定路徑+參數(shù)的小程序碼就必須要借助小程序提供的API來(lái)實(shí)現(xiàn)了。

此次來(lái)和大家說(shuō)一說(shuō)如何利用云函數(shù)來(lái)實(shí)現(xiàn)獲取特定路徑+參數(shù)的小程序碼。

接口

云函數(shù)為我們提供了三種獲取小程序碼的API：

前兩個(gè)都有數(shù)量限制，無(wú)法滿足一些類似詳情分享的場(chǎng)景，所以留給我們的道路只有wxacode.getUnlimited接口了。

先來(lái)看一下這個(gè)接口的主要參數(shù)：

其他參數(shù)就不一一列舉了，有需要可以直接去官方文檔查看。 根據(jù)上面的參數(shù)，我們可以指定任意page，而且還可以傳入頁(yè)面參數(shù)，最終在小程序頁(yè)面加載的時(shí)候，通過(guò)options來(lái)獲取到scene，從而做數(shù)據(jù)加載。

實(shí)現(xiàn)

云函數(shù)

先來(lái)看一下云函數(shù)如何配置。 新建一個(gè)云函數(shù)qrcode后，在config.json中配置如下：

{
  "permissions": {
    "openapi": [
      "wxacode.getUnlimited"
    ]
  }
}
復(fù)制代碼

然后在index.js中加入如下代碼：

// 云函數(shù)入口文件
const cloud = require('wx-server-sdk')

cloud.init()

// 云函數(shù)入口函數(shù)
exports.main = async(event, context) => {
  try {
    let param = {
      // 小程序傳入的 scene 參數(shù)
      scene: event.scene,
      // 可以換成任意 page
      page: 'pages/index/index',
    };
    // 調(diào)用接口
    var result = await cloud.openapi.wxacode.getUnlimited(param)
    return result
  } catch (err) {
    return err
  }
}
復(fù)制代碼

然后部署到云端，云函數(shù)部分就完成了。

小程序

再來(lái)看看小程序端如何調(diào)用：

requestQrcode(scene) {
    let that = this;
    wx.cloud.callFunction({
        name: 'qrcode',
        data: {
          scene: scene
        }
      })
      .then((res) => {
        let path = wx.env.USER_DATA_PATH + '/' + res.requestID + '.jpg'
        if (res.result.contentType == 'image/jpeg') {
          // 返回的結(jié)束是 base64 編碼的二進(jìn)制流
          // 這里直接保存到文件
          wx.getFileSystemManager()
            .writeFile({
              filePath: path,
              data: res.result.buffer,
              encoding: 'base64',
              success: (res) => {
              },
              fail: (res) => {
              }
            })
        } else {
          // 異常處理
        }
      })
  },
復(fù)制代碼

最終在頁(yè)面的onLoad(options)中可以這樣獲取到小程序碼傳遞的參數(shù)scene：

onLoad: function(options) {
  let scene = options.scene;
},
復(fù)制代碼

這樣就完成了利用云函數(shù)來(lái)生成特定路徑+參數(shù)的小程序碼了，后面就可以利用這個(gè)小程序碼來(lái)繪制海報(bào)。

問(wèn)題

不知道你是否注意到scene參數(shù)有一個(gè)限制,最大32個(gè)可見(jiàn)字符，有時(shí)候很容易就超出了，那豈不是就沒(méi)法用了？

沒(méi)有什么可以難倒程序員！如果有，那一定是需求不合理~

短鏈，一個(gè)很好的方案。把所有的參數(shù)生成一個(gè)唯一的短鏈，作為scene參數(shù)傳遞，最后在加載的時(shí)候先解析短鏈，就可以獲取到超長(zhǎng)參數(shù)啦~

小技巧

如果你不需要給頁(yè)面?zhèn)魅雲(yún)?shù)，直接在小程序管理平臺(tái)最上方，有個(gè)工具->生成小程序碼，填上頁(yè)面路徑就可以生成小程序碼素材啦~

結(jié)尾

最后分享一個(gè)成品~