推播作用我就不廢話了,能做推播的都知道作用,直接上乾貨。
Dcloud 開發者實名認證註冊賬號,繫結對應的 app 資訊。
uni-push產品有2個入口:
通過 HBuilderX(3.5.1及其以上版本)進入
開啟 HBuilderX,雙擊專案中的 「manifest.json」 檔案,選擇「App 模組設定」,向下找到「Push(訊息推播)」,勾選後,點選 「uniPush」 下面的設定連結。如下圖所示:
通過開發者中心進入
使用 HBuilder 賬號登入 開發者中心 ,登入後 會進入「uniPush」-「Uni Push 2.0(支援全端推播)」-「應用資訊」,點選「當前應用」選擇要操作的應用。
以上兩種方式均可進入uniPush 應用開通介面。如下圖所示:
按照國家法律要求,所有提供雲服務的公司在使用者使用雲服務時都需要驗證手機號。
使用者初次開通 uni-push 時,需要向個推同步手機號資訊(DCloud開發者無需再註冊個推賬戶)。
關聯服務空間說明:uni-push2.0需要開發者開通uniCloud。不管您的業務伺服器是否使用uniCloud,但專業推播伺服器在uniCloud上。生成雲函數,放置雲伺服器上。
Push模組管理推播訊息功能,可以實現線上、離線的訊息推播,通過 plus.push 可獲取推播訊息管理物件。
3.1、獲取裝置資訊
使用者端標識資訊用於業務伺服器下發推播訊息時提交給推播伺服器的資料,用於說明下發推播訊息的接收者(使用者端)。通常需要使用者端在第一次執行時獲取並提交到業務伺服器繫結。
ClientInfo : 使用者端推播標識資訊物件
let clientInfo = plus.push.getClientInfo()let cid = cliendInfo.clientId
cid : 使用者端推播標識,類似於聯絡人的電話號碼。
3.2、推播事件監聽器
void plus.push.addEventListener( event, listener, Boolean );
新增推播訊息事件監聽器,當指定推播事件發出時觸發。
引數:
type: ( String ) 必選 事件型別
支援事件型別:"click"-從系統訊息中心點選訊息啟動應用事件;"receive"-應用從推播伺服器接收到推播訊息事件。
listener: ( PushReceiveCallback ) 必選 事件監聽器回撥函數,在接收到推播訊息時呼叫
capture: ( Boolean ) 可選 是否捕獲事件,此處可忽略
平臺支援:
Android - 2.2+ (支援)
iOS - 4.3+ (支援) :
在使用者端在執行時收到推播訊息觸發receive事件,離線接收到的推播訊息全部進入系統訊息中心。
plus.push.addEventListener('receive',(message)=>{
//收到透傳訊息,執行該事件
})
點選推播事件範例:
plus.push.addEventListener('click',(message)=>{ // 點選通知訊息的時候執行該事件 // message 推播的所有資訊 let payload = message.payload;//自定義內容獲取 try{ //自己的業務邏輯 如頁面跳轉,網路跳轉 }catch(err){ } })
3.3、自定義推播訊息欄
void plus.push.createMessage( content, payload, option );
說明:
在本地直接建立推播訊息,並新增到系統訊息中心。
引數:
content: ( String ) 必選 ,訊息顯示的內容,在系統通知中心中顯示的文字內容。
payload: ( String | Object ) 可選,訊息承載的資料,可根據業務邏輯自定義資料格式。
options: ( MessageOptions ) 可選 建立訊息的額外引數,參考MessageOptions。如圖示、標題等。
有些童鞋雖然自定義了推播訊息,但是發現無論怎麼設定引數都不起作用。這是什麼原因呢?
3.4、setAutoNotification
setAutoNotification 設定程式是否將訊息顯示在系統訊息中心。
void plus.push.setAutoNotification( notify );
說明:
預設情況下程式在接收到推播訊息後將會在系統訊息中心顯示,通過此方法可關閉預設行為,接收到推播訊息後不在系統訊息中心顯示,通過addEventListener方法的「receive」事件監聽處理接收到的訊息。在這種模式下可通過createMessage方法建立在系統訊息中心顯示的訊息。
引數:
notify: ( Boolean ) 必選 是否自動提示推播訊息
可取值true或false,true表示自動顯示推播訊息,false則不顯示。預設值為true。
3.5、清空所有推播訊息
void plus.push.clear();
上面列舉了超級常用的幾個方法,剩餘的大家看官方檔案,方法介紹一看就會。
官方檔案:https://www.html5plus.org/doc/zh_cn/push.html
4.1、獲取裝置資訊
uni.getPushClientId 獲取使用者端唯一的推播標識。
注意:這是一個非同步的方法,且僅支援uni-push2.0;
OBJECT 引數說明
引數名 |
型別 |
必填 |
說明 |
success |
Function |
是 |
介面呼叫的回撥函數,詳見返回引數說明 |
fail |
Function |
否 |
介面呼叫失敗的回撥函數 |
complete |
Function |
否 |
介面呼叫結束的回撥函數(呼叫成功、失敗都會執行) |
success 返回引數說明
引數 |
型別 |
說明 |
cid |
String |
個推使用者端推播id,對應uni-id-device表的push_clientid |
errMsg |
String |
錯誤描述 |
fail 返回引數說明
引數 |
型別 |
說明 |
errMsg |
String |
錯誤描述 |
常見報錯:
getPushClientId:fail register fail: {\"errorCode\":1,\"errorMsg\":\"\"}
請檢查:
當前應用是否已開通uni-push2.0 詳情參考
使用者端對應平臺是否已啟用uni-push2.0詳情參考
HBuilderX3.5.1 App平臺vue3專案首次啟動呼叫uni.getPushClientId 存在可能獲取不到cid的問題,HBuilderX3.5.2修復了此問題,請升級。
範例程式碼:
uni.getPushClientId({ success: (res) => { console.log(res.cid); }, fail(err) { console.log(err) } })
4.2、監聽推播訊息
uni.onPushMessage(callback) 啟動監聽推播訊息事件。
uni.onPushMessage((res) => { console.log('監聽推播訊息', res) }) //收到訊息內容 { "type":"click", "data":{ "__UUID__":"androidPushMsgXXXXXX", "title":"tmgh", "appid":"__UNI__DXXXXX", "content":"c✨", "payload":{ "timeMillis":"1686192721365" }, "force_notification":"true" } }
4.3、建立本地通知欄訊息
uni.createPushMessage(OBJECT) 建立本地通知欄訊息(HBuilderX 3.5.2起支援)
平臺差異說明
App |
H5 |
快應用 |
微信小程式 |
支付寶小程式 |
百度小程式 |
位元組跳動小程式、飛書小程式 |
QQ小程式 |
快手小程式 |
京東小程式 |
√ |
x |
x |
x |
x |
x |
x |
x |
x |
x |
OBJECT 引數說明
引數名 |
型別 |
必填 |
說明 |
title |
string |
否 |
推播訊息的標題,在系統訊息中心顯示的通知訊息標題,預設值為程式的名稱。 |
content |
string |
是 |
訊息顯示的內容,在系統通知中心中顯示的文字內容。 |
payload |
string、Object |
否 |
訊息承載的資料,可根據業務邏輯自定義資料格式。 |
icon |
string |
否 |
推播訊息的圖示 |
sound |
string |
否 |
'system' 'none'推播訊息的提示音 |
cover |
boolean |
否 |
是否覆蓋上一次提示的訊息 |
delay |
number |
否 |
提示訊息延遲顯示的時間 |
when |
Date |
否 |
訊息上顯示的提示時間 |
success |
Function |
否 |
介面呼叫成功的回撥函數 |
fail |
Function |
否 |
介面呼叫失敗的回撥函數 |
complete |
Function |
否 |
介面呼叫結束的回撥函數(呼叫成功、失敗都會執行) |
uni.createPushMessage({ title: '自創標題', content: '自創內容', payload: {}, success: () => { console.log("自創推播成功") }, fail: () => { console.log("自創推播失敗") } })
4.4、關閉訊息監聽
uni.offPushMessage(callback) 關閉推播訊息監聽事件 範例程式碼:
let callback = (res)=>{ console.log(res) } //啟動推播事件監聽 uni.onPushMessage(callback); //關閉推播事件監聽 uni.offPushMessage(callback);
前端同學最愁的就是按照官方檔案寫了,看著沒有問題,但是推播就是不好,出現問題找不到解決辦法愁死人。
無法觸發推播事件,怎麼解決?
plus.push.addEventListener("receive") 和 uni.onPushMessage 無法觸發,需要透傳訊息,使用unipush 後臺推播透傳訊息可以觸發,但是自己平臺的推播始終不執行,好氣哦!
網上各種百度,解決辦法五花八門的,最後還是在官方檔案裡找到解決辦法,建議大家多看開發檔案。
解決辦法:
修改雲函數中 force_notification 設定引數。
伺服器端執行推播時,傳遞引數force_notification:true,使用者端就會自動建立「通知欄訊息」(此時你監聽不到訊息內容),當用戶點選通知欄訊息後,APP才能監聽到訊息內容。