eggjs實現微信傳送訂閱功能

語言: CN / TW / HK

theme: fancy

需求

有這麼一個需求,一群小夥伴要去一個地方集合,但是人數很多,無法統計;那麼我們就需要做一個簽到功能(小程式);當散會以後,我們又可以傳送通知給簽到者你簽到成功啦!現在可以離開了。

要實現這種功能就需要用到小程式的訂閱功能!

訂閱功能又分為一次訂閱和長期訂閱功能,如果是一次訂閱的話需要每次都授權,否則通知不到使用者;但是大部分功能都只能一次訂閱;大家可以詳情看看文件 微信訂閱相關文件

設定訂閱

在微信公眾平臺上開通訂閱功能

根據自己的需求進行配置即可!

如下圖:

Snipaste_2023-03-10_10-37-52.png

訂閱授權

在tmplIds中填寫你配置的訂閱模板id;需要訂閱的訊息模板的id的集合,一次呼叫最多可訂閱3條訊息;這樣授權以後就可以傳送訂閱訊息了

javascript wx.requestSubscribeMessage({ tmplIds: ['*********************'], success (res) { console.log(res); }, fail(err){ console.log(err); } })

小程式獲取code

前臺獲取code;主要用於獲取openid時使用;有效時間只能60秒左右(我記得好像是)

javascript wx.login({ success: res => { console.log(res); // 傳送 res.code 到後臺換取 openId, sessionKey, unionId } })

獲取openid

這兒需要傳遞過來的code(前臺獲取的code)然後通過小程式的開放介面以及appid和appSecret獲得openid;小程式登入技術文件

```javascript const Controller = require('egg').Controller;

const wxConfig = { appid: '**', appSecret: '****' }

class WxMinniController extends Controller { // 通過 wx.login 介面獲得臨時登入憑證 code 後傳到開發者伺服器呼叫此介面完成登入流程 async openid() { const { ctx } = this; const { code } = ctx.request.body; const urlStr = 'http://api.weixin.qq.com/sns/jscode2session' const data = { appid: wxConfig.appid, // 小程式 appId secret: wxConfig.appSecret, // 小程式 appSecret js_code: code, // 登入時獲取的 code grant_type: 'authorization_code' // 授權型別,此處只需填寫 } const result = await ctx.curl(urlStr, { data: data, dataType: 'json', }); if(result.data.errmsg){ ctx.body = { code: 201, msg: '操作失敗', errcode: result.data.errcode, errmsg: result.data.errmsg }; }else{ ctx.body = { code: 200, msg: '操作成功', openid: result.data.openid, session_key: result.data.session_key }; } } } module.exports = WxMinniController;

``` 成功返回:

javascript { "code": 200, "msg": "操作成功", "openid": "***********", "session_key": "****==" }

獲取access_token

獲取access_token的目的主要是為了傳送訂閱訊息的時候需要攜帶這個值才能成功傳送訂閱訊息通知使用者;token有效期為7200s

獲取介面呼叫憑據文件

javascript async accessToken () { const { ctx } = this; const urlStr = 'http://api.weixin.qq.com/cgi-bin/token' const data = { appid: wxConfig.appid, // 小程式 appId secret: wxConfig.appSecret, // 小程式 appSecret grant_type: 'client_credential', // 登入時獲取的 code } const { data:result } = await ctx.curl(urlStr, { method:"GET", data, dataType: 'json', }); ctx.body = { code: 200, msg: '操作成功', data:result, }; }

傳送訂閱訊息

  • touser 使用者openid
  • template_id 訂閱模板
  • miniprogram_state 跳轉小程式型別 developer為開發版;trial為體驗版;formal為正式版;預設為正式版
  • lang 進入小程式檢視”的語言型別,支援zh_CN(簡體中文)、en_US(英文)、zh_HK(繁體中文)、zh_TW(繁體中文),預設為zh_CN
  • data 模板內容,格式形如 { "key1": { "value": any }, "key2": { "value": any } }的object
  • page 點選模板卡片後的跳轉頁面,僅限本小程式內的頁面。支援帶引數,(示例index?foo=bar)。該欄位不填則模板無跳轉

更多的資訊可以根據文件配置相關的資訊 傳送訂閱訊息文件

引數說明: row格式,data中的time24需要和微信公眾號裡面配置的訂閱訊息欄位保持一致

javascript { "touser": "*************************", "template_id": "*********************************", "miniprogram_state":"developer", "lang":"zh_CN", "data": { "time24": { "value": "2019年11月11日 20:20" }, "time27": { "value": "2019年11月11日 20:20" }, "thing21": { "value": "小程式由公眾號:廣東專插本最前線開發" }, "thing23": { "value": "小程式由公眾號:廣東專插本最前線開發" } } }

傳送訂閱訊息相關程式碼:

```javascript async subscription () { const { ctx } = this; const { access_token, touser, template_id } = ctx.request.body; const urlStr = 'http://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=' + access_token; const data = { "touser": touser, // 接收者(使用者)的 openid "template_id": template_id, // 所需下發的訂閱模板id "miniprogram_state":"developer", // 跳轉小程式型別 "lang":"zh_CN", // 語言型別 "data": { "time24": { "value": "2019年11月11日 20:20" }, "time27": { "value": "2019年11月11日 20:20" }, "thing21": { "value": "小程式通知簽到提醒" }, "thing23": { "value": "小程式通知簽到提醒" } } } const { data:result } = await ctx.curl(urlStr, { method:"POST", data, dataType: 'json', headers:{ "Content-type":"application/json" } });

ctx.body = {
    code: 200,
    msg: '操作成功',
    data:result,
  };

} ```

當你做到這兒的時候就說明訂閱訊息基本上完成了;我做的這個可能比較粗糙,大家可以根據文件做一些優化功能!

希望小夥伴們有所收穫哦!拜拜啦!下次再見

往期文章