微信小程序模板消息推送的兩種實現(xiàn)方式
最近在做微信小程序,為了讓用戶能更加方便的獲取到小程序內部的通知,便想著用模板消息來解決此類問題。首先介紹一下兩種方法
第一種是傳統(tǒng)的按照微信開發(fā)文檔來實現(xiàn)模板消息的獲取,首先要明確的是你要有一個第三方的服務器,因為微信現(xiàn)在規(guī)定在小程序內部不能直接請求微信的服務器,而是要請求第三方服務器,由第三方服務器來請求微信的服務器
1.傳統(tǒng)方式實現(xiàn)模板消息
1.1獲取用戶openId
這一步可以在wx.login方法內獲取,用來標注模板消息的接受者
1.2獲取模板ID
有兩個方法可以獲取模版ID
通過模版消息管理接口獲取模版ID(在微信公眾平臺手動配置獲取模版ID登錄https://mp.weixin.qq.com 獲取模板,如果沒有合適的模板,可以申請?zhí)砑有履0澹瑢徍送ㄟ^后可使用
1.3獲取access_token
access_token 是全局唯一接口調用憑據(jù),開發(fā)者調用各接口時都需使用 access_token,請妥善保存。access_token 的存儲至少要保留512個字符空間。access_token 的有效期目前為2個小時,需定時刷新,重復獲取將導致上次獲取的 access_token 失效。
公眾平臺的 API 調用所需的 access_token 的使用及生成方式說明:
- 為了保密 appsecrect,第三方需要一個 access_token 獲取和刷新的中控服務器。而其他業(yè)務邏輯服務器所使用的 access_token 均來自于該中控服務器,不應該各自去刷新,否則會造成 access_token 覆蓋而影響業(yè)務;
- 目前 access_token 的有效期通過返回的 expires_in 來傳達,目前是7200秒之內的值。中控服務器需要根據(jù)這個有效時間提前去刷新新 access_token。在刷新過程中,中控服務器對外輸出的依然是老 access_token,此時公眾平臺后臺會保證在刷新短時間內,新老 access_token 都可用,這保證了第三方業(yè)務的平滑過渡;
- access_token 的有效時間可能會在未來有調整,所以中控服務器不僅需要內部定時主動刷新,還需要提供被動刷新 access_token 的接口,這樣便于業(yè)務服務器在 API 調用獲知 access_token 已超時的情況下,可以觸發(fā) access_token 的刷新流程。
開發(fā)者可以使用 AppID 和 AppSecret 調用本接口來獲取 access_token。AppID 和 AppSecret 可登錄微信公眾平臺官網(wǎng)-設置-開發(fā)設置中獲得(需要已經(jīng)綁定成為開發(fā)者,且?guī)ぬ枦]有異常狀態(tài))。AppSecret 生成后請自行保存,因為在公眾平臺每次生成查看都會導致 AppSecret 被重置。注意調用所有微信接口時均需使用 https 協(xié)議。如果第三方不使用中控服務器,而是選擇各個業(yè)務邏輯點各自去刷新 access_token,那么就可能會產(chǎn)生沖突,導致服務不穩(wěn)定。
以上內容是微信開發(fā)文檔給出的access_token的說明,總的來說就是兩點,(1)access_token是發(fā)送模板消息的憑證,需要用微信小程序的AppID 和AppSecret 調用接口來獲取,有效時間為2小時,(2)如果在此獲取access_token則會導致前一個access_token失效,有多個公眾號和小程序的開發(fā)者一定要注意這一點!
接口地址:
https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
HTTP請求方式:
GET
參數(shù)說明 :
參數(shù) | 必填 | 說明 |
---|---|---|
grant_type | 是 | 獲取 access_token 填寫 client_credential |
appid | 是 | 第三方用戶唯一憑證 |
secret | 是 | 第三方用戶唯一憑證密鑰,即appsecret |
代碼:
function onRequest(request, response, modules) { var http = modules.oHttp; //發(fā)起Get請求 http('https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=XXX&secret=XXX', function (error, res, body) { response.send(body); }); }
返回結果:
Response Body { "code": 200, "msg": {"access_token":"6_R8kOFxRLeRtWOq_haIU29XB0hbAoKxFGRqQTZt_HhzCSEvT_xDJ4WLgf9A_dt2pRTCugfUk7IkxR2sfu5zckCwKKWEghCtqlrrQlhdJmCxmkBAaDEdW7AU98D23rUJO5PYruNYOLQ3cpH3iAVTNiADAECW","expires_in":7200} }
1.4發(fā)送模板消息
接口地址:(ACCESS_TOKEN 需換成上文獲取到的 access_token)
https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=ACCESS_TOKEN
HTTP請求方式:
POST
POST參數(shù)說明:
參數(shù) | 必填 | 說明 |
---|---|---|
touser | 是 | 接收者(用戶)的 openid |
template_id | 是 | 所需下發(fā)的模板消息的id |
page | 否 | 點擊模板卡片后的跳轉頁面,僅限本小程序內的頁面。支持帶參數(shù),(示例index?foo=bar)。該字段不填則模板無跳轉。 |
form_id | 是 | 表單提交場景下,為 submit 事件帶上的 formId;支付場景下,為本次支付的 prepay_id |
data | 是 | 模板內容,不填則下發(fā)空模板 |
color | 否 | 模板內容字體的顏色,不填默認黑色 |
emphasis_keyword | 否 | 模板需要放大的關鍵詞,不填則默認無放大 |
formid說明:頁面的 <form/>
組件,屬性report-submit
為true
時,可以聲明為需發(fā)模板消息,此時點擊按鈕提交表單可以獲取formId
代碼:
var temp = { "touser": touser,//用戶的openid "template_id": template_id,//模板id "page": "", "form_id": formid,//表單id "data": { "keyword1": { "value": title, "color": "#173177" }, "keyword2": { "value": gettime() }, }, "emphasis_keyword": "keyword1.DATA" //將keyword1放大 }
1.5測試效果
2.基于Bmob后端云的模板消息實現(xiàn)
第一種方法實現(xiàn)起來過于繁瑣,在使用過程中也要中間服務器的幫助,如果沒有中間服務器,或者服務器端的代碼不太熟悉,那么Bmob后端云則可以幫助你實現(xiàn)你要的功能
只需要下載按照官網(wǎng)文檔在小程序內初始化好Bmob,那么就可以調用Bmob模板消息的方法,如下所示
function send(title, formid, touser){ var Bmob = require('bmob.js'); var temp = { "touser": touser, "template_id": "ClYq9lc8bZh26uM993NNIknasAVBdk0wSYnDrkClK40", "page": "", "form_id": formid, "data": { "keyword1": { "value": title, "color": "#173177" }, "keyword2": { "value": gettime() }, }, "emphasis_keyword": "keyword1.DATA" } Bmob.sendMessage(temp).then(function (obj) { console.log('發(fā)送成功'); }, function (err) { common.showTip('失敗' + err) }); }
這樣模板消息就解決了
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關文章
JavaScript實現(xiàn)數(shù)組對象轉換為鍵值對的四種方式
本文探討了將包含 {icon: "abc", url: "123"} 形式對象的數(shù)組轉換為鍵值對形式的四種方法,并從實現(xiàn)方式的簡潔性、可讀性和性能角度進行了分析比較,感興趣的朋友可以參考下2024-02-02addEventListener()和removeEventListener()追加事件和刪除追加事件
這篇文章主要給大家介紹了關于addEventListener()和removeEventListener()追加事件和刪除追加事件的相關資料,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2020-12-12