关于小程序云开发:借助小程序云开发创建微信卡券

背景

2020 年腾讯数字文创节（以下简称 TGC）在海南举办，为了能让玩家提前理解 TGC 的文化和线下流动，在流动开始前的一个月工夫，咱们就上线了「线上提前预约门票」的性能。为了晋升门票预约的体验，以及更好的在流动开始之前提前触达到预约门票的用户，团队往年在小程序预约门票的根底上减少了「增加门票到微信卡券」的性能。

您须要提前准备以下账号信息：

• 微信开放平台账号
• 微信小程序账号
• 微信公众号

接入流程

一、将微信小程序账号和微信公众号绑定在同一个微信开放平台账号下

二、开明微信公众号的卡券性能

在 mp.weixin.qq.com 中，登录微信公众号后盾，点击左侧菜单栏 -> 性能 -> 卡券性能（如果没有该性能，请点击增加性能插件进行增加）。

拜访 open.weixin.qq.com，登录微信开放平台后，将小程序账号和微信公众号绑定在该开放平台账号下。

三、生成卡券模板

在微信公众号后盾，能够对优惠券和会员卡类型进行手动创立，然而针对一些非凡的票券则须要应用 API（会议门票、电影票和景区门票等等）的形式进行生成，TGC 的流动是在海南线下举办，所以咱们则应用了微信卡券的景区门票类型，无奈间接在后盾间接创立，所以这里介绍下如果应用 API 的形式进行生成。

1、获取 access_token

创立卡券 API 须要用到微信的 access_token，而公众号生成 access_token 的形式须要特地留神一下，须要在公众号后盾绑定生成 access_token 的服务器 IP 白名单，因为生成卡券咱们只须要创立一次，所以这里咱们间接增加本地的 IP 作为白名单 IP 即可。

2、创立卡券

这一步就是利用创立卡券的 API，传入卡券的配置即可。相干的申请参数阐明间接查看文档：

https://developers.weixin.qq.com/doc/offiaccount/Cards_and_Offer/Special_ticket.html

这里特地须要留神的是，小程序增加微信卡券性能容许咱们将卡券应用界面增加跳转回小程序的入口，所以在创立卡券的时候，咱们能够通过设置一些参数，让卡券服务入口能跳转回小程序内，具体参数阐明，请返回相干文档查看，这里简略贴下应用成果，供大家参考。

https://mpvideo.qpic.cn/0b787maacaaap4agpgohvjpvb66dah5qaaia.f10003.mp4?dis_k=0b5c784eddced7846b4e75ea1d75deec&dis_t=1606965761&vid=wxv_1632610307195928577&format_id=10003

文档链接：

https://developers.weixin.qq.com/doc/offiaccount/Cards_and_Offer/Coupons-Mini_Program_Start_Up.html#21

四、服务端生成卡券下发 （小程序云开发）

创立完卡券之后，接下就是用户在小程序内通过某些操作支付卡券了。小程序内支付卡券须要服务端提供卡券的校验参数，所以这一步，咱们介绍下如何在服务端生成卡券的校验参数。

1、生成 access_token

这步咱们在生成卡券模板中有提到过，只不过因为这里客户端频繁调用的，咱们须要在代码层面去实现 access_token 的获取。这里因为咱们应用的是小程序云，云函数的运行机制，导致其默认的是非固定 IP，咱们须要在腾讯云的 cloudbase 控制台，将获取 access_token 的云函数设置成固定 IP。

设置固定 IP 胜利后，将失去的 IP 配置到 公众号治理后盾的 开发 -> 根本配置 -> IP 白名单 中：

配置好 IP 白名单后，利用根本配置中的 AppID 和 AppSecret 申请 access_token:

let requestApiTicketResult = await request({
uri: 'https://api.weixin.qq.com/cgi-bin/ticket/getticket',
qs: {
access_token: accessToken,
type: 'wx_card'
}
})

2、生成 api_ticket

生成 api_ticket 和获取 access_token 相似，间接利用 access_token 申请微信的接口获取即可，这里须要留神的是，access_token 和 api_ticket 每天都有申请次数的限度以及都有过期工夫，所以咱们须要将这两个值缓存起来应用（注：这个问题如同不少新人同学都犯过错）。

let requestApiTicketResult = await request({
uri: 'https://api.weixin.qq.com/cgi-bin/ticket/getticket',
qs: {
access_token: accessToken,
type: 'wx_card'
}
})

3、生成卡券参数

卡券参数次要分为这几局部：随机字符串 nonce_str、工夫戳 timestamp、用户 openid、卡券号码 code、卡券签名 signature。

卡券签名 signature 的生成依赖其余的参数。

后端代码实现：

const cardExt = {
  cardId: 'cardId', // 卡券 id
  code: code,
  api_ticket: apiTicket,
  nonce_str: generate(),
  timestamp: parseInt((Date.now() / 1000), 10) + ''
}
  // 依照字典升序排列
return {
  cardId: 'CardId',
  cardExt: JSON.stringify({
    openid: '', // 不指定 openid 支付
    code: cardExt.code,
    nonce_str: cardExt.nonce_str,
    timestamp: cardExt.timestamp,
    signature: sha1(valueToString(cardExt))
  })
}

// 生成随机字符串
const generate = (length = 16) => {
  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
  let noceStr = '',
    maxPos = chars.length
  while (length--) noceStr += chars[Math.random() * maxPos | 0]
  return noceStr
}

// 排序
const valueToString = (obj) => Object.values(obj).sort().join('')
// 加密
const sha1 = (str, encoding = 'utf8') => crypto.createHash('sha1').update(str, encoding).digest('hex')

五、小程序端增加卡券

小程序端增加卡券的就间接将服务端生成的卡券参数传入小程序增加卡券 API 即可：

wx.addCard({
  cardList: [
    {
      cardId: 'cardId',
      cardExt: 'cardExt'  // 拿到后端生成好的 cardExt
    }],
  success (res) {console.log(res.cardList) // 卡券增加后果
  }
})

六、实现成果

调用 wx.addCard 的成果：
https://mpvideo.qpic.cn/0bf2zqajcaaamuapo4whhzpvbtgdshgabeia.f10003.mp4?dis_k=ac4ecd081e5bd82538b35e66048f9553&dis_t=1606965761&vid=wxv_1632610927046950928&format_id=10003

调用 wx.openCard 的成果：

https://mpvideo.qpic.cn/0bf2keajuaaasaapzhwhgzpvauodtjiqbgqa.f10003.mp4?dis_k=e5a8f12483c37c31b368ac10980b9d67&dis_t=1606965761&vid=wxv_1632611336343912456&format_id=10003

七、门票卡券核销

因为业务的特殊性 (用户能够屡次通过门票卡券二维码进入流动现场)，咱们并未对卡券做核销的操作。然而卡券自身的核销也是间接能够通过微信卡券核销接口进行核销，因为这部分比较简单，这里就不冗余论述了，间接能够通过查看文档实现：
https://developers.weixin.qq.com/doc/offiaccount/Cards_and_Offer/Redeeming_a_coupon_voucher_or_card.html

产品介绍

云开发（Tencent CloudBase，TCB）是腾讯云提供的云原生一体化开发环境和工具平台，为开发者提供高可用、主动弹性扩缩的后端云服务，蕴含计算、存储、托管等 serverless 化能力，可用于云端一体化开发多种端利用（小程序，公众号，Web 利用，Flutter 客户端等），帮忙开发者对立构建和治理后端服务和云资源，防止了利用开发过程中繁琐的服务器搭建及运维，开发者能够专一于业务逻辑的实现，开发门槛更低，效率更高。
开明云开发：https://console.cloud.tencent.com/tcb?tdl_anchor=techsite
产品文档：https://cloud.tencent.com/product/tcb?from=12763
技术文档：https://cloudbase.net?from=10004
技术交换加 Q 群：601134960
最新资讯关注微信公众号【腾讯云云开发】