您的位置:

Uniapp推送详解

一、Uniapp推送通知

Uniapp推送通知作为手机APP通知用户的一种方式,通常出现在手机的状态栏中。Uniapp采用了友好和简单易用的API进行推送。Uniapp提供的notifications模块可以轻松地帮助开发人员在APP的状态栏上展示通知。

Uniapp的推送通知主要分为两种,分别为本地推送和远程推送。本地推送可以在APP内直接推送显示,而远程推送需要服务器向推送平台发送推送。

uni.showNotification({
    title: '推送标题',
    content: '推送内容',
    payload: '{customData:123}'
});

上述代码为Uniapp展示本地推送通知的API,给出了通知的标题和内容。另外,开发者还可以添加payload属性,以便在用户点击通知时获取通知中的额外信息,比如是否需要跳转到其他页面或显示更多详细信息。

二、Uniapp推送消息

与Uniapp推送通知不同,Uniapp推送消息是必须经过服务器推送平台的。Uniapp实现推送消息最常用的方式是通过调用messaging模块的API。

//在manifest.json中注册 APPID 和 APPKEY
"manifest":{
  ...
  "app-plus":{
    "appid":"wxxxxxxxxxxxxxxxxx",
    "appkey":"xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
  }
}
// 在 page 中发送推送消息
import {sendUniPushMessage} from '@/common/js/uni-push.js';

function sendPush() {
    sendUniPushMessage({
        title: '推送标题',
        content: '推送内容',
        openUrl: '/pages/home/home',
        extras: {
            id: '123',
            type: 'order'
        }
    });
}

以上代码展示了Uniapp推送消息的实现流程。开发人员需要在manifest.json文件中注册APPID和APPKEY,以便向推送平台注册APP。而在具体页面中,开发人员可以使用自定义JS库uni-push来发送推送消息,向用户推送消息内容、打开URL等。

三、UniPush推送

UniPush是Uniapp推送服务平台,提供开发者快速开始、简化SDK使用、便捷的管理功能。Uniapp开发人员可以在Unipush平台上创建应用,获取API KEY和SECRET KEY,在APP端使用对应的SDK,将推送消息发送到Unipush平台。

Unipush平台还提供了测试推送、统计分析、细分用户群体等完整的推送管理功能。此外,开发人员可以通过自定义标签来细分用户,将推送消息发送到特定标签的用户。

四、Uniapp推送点击事件

当用户点击Uniapp推送通知时,开发人员需要在代码中处理推送通知的点击事件,以便在用户点击通知时展示更多信息或打开应用特定页面。Uniapp提供了API onNotificationTap,通过该API,开发人员能够为推送通知设置点击事件的处理逻辑。

uni.onNotificationTap(function(res) {
    uni.showToast({
        title: '点击打开页面:' + res.openUrl
    });
});

五、Uniapp推送通知栏样式

Uniapp推送通知栏样式是Uniapp推送通知在状态栏中的展示形式。开发者可以通过修改通知栏样式,使推送通知在状态栏中更加美观。Uniapp的notifications模块提供了API setStyle,可以帮助开发人员在推送通知的展示样式中设置自己想要的格式。

uni.setStyle({
    statusBarColor: '#F8F8F8',
    statusBarStyle: 'dark',
    titleNView: {
        backgroundColor: '#F8F8F8',
        titleColor: '#000000',
        titleText: 'Hello uni-app'
    }
});
uni.showNotification({
    title: '推送标题',
    content: '推送内容',
    payload: '{customData:123}'
});

六、Uniapp推送跳转

Uniapp推送跳转指的是当用户点击推送通知时,应用打开指定页面的操作。Uniapp提供了多种方式实现推送通知的跳转功能。例如,在推送通知的标题栏上设置一个URL,当用户点击标题栏时打开相应的页面。

uni.showNotification({
    title: '推送标题',
    content: '推送内容',
    payload: '{"url":"http://www.baidu.com"}'
    });
uni.onNotificationTap(function (msg) {
    uni.navigateTo({
        url: msg.openUrl
    });
});

七、Uniapp推送消息费用

Uniapp推送消息的费用根据使用的推送平台不同而有所不同。目前Uniapp官方推荐的推送平台是Unipush,费用也比较透明,可以在平台上查看具体的计费规则和费用明细。

八、Uniapp推送桌面角标

Uniapp推送桌面角标是iOS特有的功能。它可以让开发者在推送通知横幅上显示未读消息数量,提醒用户查看未读消息。Uniapp的notifications模块提供了API setBadge,可以帮助开发人员设置推送通知桌面角标。

uni.setBadgeNumber({
    badge: 1
});

九、Uniapp离线推送

Uniapp离线推送指的是当APP在后台运行或者未启动时,推送通知可以正常显示的功能。这个功能需要在推送平台和APP端都进行设置。开发人员需要在APP中使用onLaunch或onResume处理用户点击通知栏的逻辑。

//在App.vue中处理推送通知点击事件
onLaunch: function (res) {
    if(res && res.action === 'click') {
        console.log(res);
    }
},
onResume: function (res) {
    if(res && res.action === 'click') {
        console.log(res);
    }
}

以上代码实现了在APP后台运行时处理推送通知的点击事件。当用户通过推送通知打开APP时,可以在这里执行相应的逻辑。