小程式訊息推送種類
訂閱訊息模板訊息統一服務訊息客服訊息由於模板訊息已經下線,這裡的示例訊息是訂閱訊息
實現訂閱訊息我們開始需要知道幾個小程式的引數值
小程式appid小程式金鑰小程式訂閱模板 id (template_id)以上引數都可以在小程式管理後臺上找到
小程式端開發前需要獲取小程式設定模板 ID,沒有設定模板訊息時可以新增新的模板 mp.weixin.qq.com擁有模板 ID 後,需要獲取到下發訊息許可權使用者下發推送訊息許可權在訂單或者其它操作完成時,調起客戶端小程式訂閱訊息介面,獲取到使用者操作結果
// index.wxml<button bindtap="bindSubscribeMessage"> 獲取下發許可權 </button>// index.jsbindSubscribeMessage() { wx.requestSubscribeMessage({ tmplIds: ['tmplIds'], success (res) { console.log(res) } })}複製程式碼
傳送使用者 code由於訊息推送服務端需要小程式 openid 所以我們需要將通過 wx.login 登入小程式將 code 傳送給服務端
bindLogin() { /* 1. 獲取code 請求開發伺服器 * 2. 開發伺服器通過 code + appid + secret 請求微信伺服器獲取 openid */ wx.login({ success: res => { if (res.code) { const { task } = this.data; this.request(Object.assign(task, { code: res.code })); } } });}複製程式碼
服務端
這裡由於是自己模擬服務端,使用的 Koa 來實現基本流程,其他後端實現流程應該是一樣的
由於推送訊息需要小程式 access_token 和 openid,所以我們先要獲取這兩個引數
獲取流程
獲取小程式客服端傳參 code通過客戶端傳送介面 app/send 拿到引數 code
function getBodyMessage(ctx) { const { body } = ctx.request; return body;}複製程式碼
獲取 openid
通過 code + secret(小程式金鑰) + appid 獲取 openid
function getOpenId(js_code) { return new Promise(resolve => { \thttp( \t\t{ \t\t\turl: `https://api.weixin.qq.com/sns/jscode2session`, \t\t\tmethod: 'get', \t\t\tqs: { \t\t\t\tgrant_type: 'authorization_code', \t\t\t\tjs_code, \t\t\t\tappid: APP.appid, \t\t\t\tsecret: APP.secret \t\t\t}, \t\t\tjson: true //設定返回的資料為json \t\t}, \t\t(error, response, body) => { \t\t\tif (!error && response.statusCode == 200) { \t\t\t\tresolve(body); \t\t\t} \t\t} \t); });}複製程式碼
獲取 access_tokenfunction getAccessToken() {\treturn new Promise(resolve => {\t\thttp(\t\t\t{\t\t\t\turl: `${WX_API}/token`,\t\t\t\tmethod: 'get',\t\t\t\tqs: {\t\t\t\t\tgrant_type: 'client_credential', // 注意 type 型別\t\t\t\t\tappid: APP.appid,\t\t\t\t\tsecret: APP.secret\t\t\t\t},\t\t\t\tjson: true //設定返回的資料為json\t\t\t},\t\t\t(error, response, body) => {\t\t\t\tif (!error && response.statusCode == 200) {\t\t\t\t\tconst { access_token } = body;\t\t\t\t\tresolve(access_token);\t\t\t\t}\t\t\t}\t\t);\t});}複製程式碼
推送訊息
我們獲取到 openid 和 access_token 後就可以推送訊息給使用者了
function sendMessage({ access_token, openid, msg }) {\tconst requestData = {\t\ttouser: openid, template_id: APP.template_id, // 模板訊息屬性和屬性值需要注意內容限制\t\tdata: {\t\t\tthing1: {\t\t\t\tvalue: msg.taskName\t\t\t},\t\t\tthing10: {\t\t\t\tvalue: msg.remarks\t\t\t},\t\t\tthing9: {\t\t\t\tvalue: msg.className\t\t\t}\t\t} }; console.log(requestData);\treturn new Promise((resolve, reject) => {\t\thttp(\t\t\t{\t\t\t // 注意 access_token 需要在介面形式傳送 \t\t\t\turl: `${WX_API}/message/subscribe/send?access_token=${access_token}`,\t\t\t\theaders: {\t\t\t\t\t'content-type': 'application/json'\t\t\t\t},\t\t\t\tmethod: 'post',\t\t\t\tbody: requestData, // 需要注意是放在 body 上,而不是 form 上\t\t\t\tjson: true // 設定返回的資料為json\t\t\t},\t\t\t(error, response, body) => {\t\t\t\tif (!error && response.statusCode == 200) {\t\t\t\t\tresolve(body);\t\t\t\t} else {\t\t\t\t\treject();\t\t\t\t}\t\t\t}\t\t);\t});}複製程式碼
這裡我們需要注意:
下發的訊息模板需要注意訂閱訊息引數值內容限制,需要參考下發模板訊息屬性需要注意開發模式下,授權一次下發一次訊息後端啟動 npm run dev
實現效果
2020-03-05更新
小程式模板訊息中有兩種模板
一次性訂閱長期訂閱這兩個模板根據小程式的服務型別來區分,只有部分服務型別:醫療、民生、交通、教育之類的線下服務開放長期訂閱模板庫選擇。
社群有篇帖子詳細的說明了一些區別
最新評論