uniapp 如何实现消息推送功能

在uniapp中如何实现消息推送功能?有没有具体的实现方案或者插件推荐?希望能详细说明一下在iOS和Android平台上的配置步骤以及需要注意的兼容性问题。

2 回复

在uniapp中实现消息推送,可集成uni-push服务。步骤如下:

  1. 在DCloud开发者中心开通uni-push服务
  2. 配置应用包名和证书
  3. 在manifest.json中勾选push模块
  4. 调用API获取客户端推送标识
  5. 服务端调用推送接口发送消息

支持厂商通道(华为、小米等),提升到达率。


在 UniApp 中实现消息推送功能,主要通过集成第三方推送服务(如 UniPush)完成。以下是实现步骤和示例代码:

实现步骤

  1. 开通 UniPush 服务

    • 在 HBuilderX 中创建 UniApp 项目,并在 manifest.json 的 “App 模块配置” 中勾选 “Push(消息推送)”,选择 UniPush。
    • 登录 DCloud 开发者中心,在应用中配置 UniPush,获取 AppID 和 AppKey。
  2. 配置项目

    • 在 manifest.json 中填写 UniPush 配置信息(AppID 和 AppKey)。
    • 如需 Android 支持,需配置厂商通道(如小米、华为等),以提升推送到达率。
  3. 客户端集成

    • 使用 uni.getPushClientId() 获取客户端推送标识(CID),并上传到你的服务器。
    • 监听推送消息事件(如点击消息、接收消息)。
  4. 服务端推送

    • 通过第三方推送服务 API(如 UniPush 服务端接口),向指定 CID 或全体用户发送推送消息。

示例代码

客户端获取推送 CID 并监听消息

// 在 App.vue 的 onLaunch 中初始化
onLaunch: function() {
  // 获取推送客户端 ID
  uni.getPushClientId({
    success: (res) => {
      const cid = res.cid;
      console.log('客户端推送 CID:', cid);
      // 将 cid 发送到你的服务器保存
    },
    fail: (err) => {
      console.error('获取推送 CID 失败:', err);
    }
  });

  // 监听推送消息点击事件
  uni.onPushMessage((res) => {
    console.log('接收到推送消息:', res);
    // 处理消息,如跳转页面
    if (res.type === 'click') {
      uni.navigateTo({
        url: '/pages/notification/notification'
      });
    }
  });
}

服务端推送示例(使用 Node.js)

需安装 axios 库发送 HTTP 请求:

const axios = require('axios');

// 配置参数(从 DCloud 开发者中心获取)
const appId = '你的AppID';
const appKey = '你的AppKey';
const masterSecret = '你的MasterSecret'; // 若使用 REST API 认证

// 发送推送消息
async function sendPush(cid, title, content) {
  const url = 'https://restapi.getui.com/v2/' + appId + '/push/single/cid';
  const data = {
    request_id: Date.now().toString(),
    audience: { cid: cid },
    push_message: {
      notification: {
        title: title,
        body: content,
        click_type: 'startapp' // 点击打开应用
      }
    }
  };

  try {
    const response = await axios.post(url, data, {
      headers: {
        'Content-Type': 'application/json',
        'token': await getToken() // 需先获取认证 token
      }
    });
    console.log('推送成功:', response.data);
  } catch (error) {
    console.error('推送失败:', error.response.data);
  }
}

// 获取认证 token(需实现缓存逻辑)
async function getToken() {
  const tokenUrl = 'https://restapi.getui.com/v2/' + appId + '/auth';
  const result = await axios.post(tokenUrl, {
    sign: sha256(appKey + Date.now().toString() + masterSecret),
    timestamp: Date.now(),
    appkey: appKey
  });
  return result.data.data.token;
}

注意事项

  • 平台差异:iOS 需配置推送证书,Android 需适配厂商通道。
  • 隐私合规:确保符合《个人信息保护法》,征得用户同意后再收集 CID。
  • 测试:使用 HBuilderX 真机调试,或通过服务端 API 发送测试消息。

通过以上步骤,即可在 UniApp 中实现消息推送功能。

回到顶部