更新记录

1.0.0(2025-06-23) 下载此版本

因为项目在国外所以需要接入谷歌FCM,因很多都不支持,所以自己写了个UTS插件,不喜勿喷,不是什么大神


平台兼容性

uni-app

Vue2 Vue3 Chrome Safari app-vue app-nvue Android iOS 鸿蒙
- - - - - 5.0 - -
微信小程序 支付宝小程序 抖音小程序 百度小程序 快手小程序 京东小程序 鸿蒙元服务 QQ小程序 飞书小程序 快应用-华为 快应用-联盟
- - - - - - - - - - -

uni-app x

Chrome Safari Android iOS 鸿蒙 微信小程序
- - 5.0 - - -

ld-push

开发文档

UTS 语法 UTS API插件 UTS uni-app兼容模式组件 UTS 标准模式组件 Hello UTS

FCM推送插件

Firebase Cloud Messaging (FCM) 推送插件,支持Android和iOS平台。

功能特性

  • ✅ 初始化FCM服务
  • ✅ 获取FCM Token
  • ✅ 订阅/取消订阅主题
  • ✅ 接收推送消息
  • ✅ 支持Android和iOS平台

安装配置

1. 添加插件到项目

ld-push 插件添加到项目的 uni_modules 目录下。

2. 配置Firebase

Android配置

  1. 在Firebase控制台创建项目并下载 google-services.json 文件
  2. google-services.json 文件放到项目根目录的 nativeResources/android 目录下

iOS配置

  1. 在Firebase控制台创建项目并下载 GoogleService-Info.plist 文件
  2. GoogleService-Info.plist 文件放到项目根目录的 nativeResources/ios 目录下

3. 配置manifest.json

manifest.json 中添加必要的权限:

{
  "app": {
    "distribute": {
      "android": {
        "permissions": [
          "android.permission.INTERNET",
          "android.permission.ACCESS_NETWORK_STATE",
          "android.permission.WAKE_LOCK"
        ]
      }
    }
  }
}

使用方法

1. 引入插件

import { 
  initFCM, 
  getFCMToken, 
  subscribeTopic, 
  unsubscribeTopic, 
  onMessageReceived 
} from '@/uni_modules/ld-push/utssdk'

2. 初始化FCM

// 初始化FCM
initFCM({
  success: (res) => {
    console.log('FCM初始化成功:', res.message)
  },
  fail: (err) => {
    console.error('FCM初始化失败:', err.errMsg)
  }
})

3. 获取FCM Token

// 获取FCM Token
getFCMToken({
  success: (res) => {
    console.log('FCM Token:', res.token)
    // 将token发送到你的服务器
  },
  fail: (err) => {
    console.error('获取Token失败:', err.errMsg)
  }
})

4. 订阅主题

// 订阅主题
subscribeTopic({
  topic: 'news',
  success: (res) => {
    console.log('订阅主题成功:', res.topic)
  },
  fail: (err) => {
    console.error('订阅主题失败:', err.errMsg)
  }
})

5. 取消订阅主题

// 取消订阅主题
unsubscribeTopic({
  topic: 'news',
  success: (res) => {
    console.log('取消订阅成功:', res.topic)
  },
  fail: (err) => {
    console.error('取消订阅失败:', err.errMsg)
  }
})

6. 监听推送消息

// 监听推送消息
onMessageReceived((message) => {
  console.log('收到推送消息:', message)
  console.log('消息标题:', message.title)
  console.log('消息内容:', message.body)
  console.log('消息数据:', message.data)
})

完整示例

<template>
  <view class="container">
    <button @click="initFCMService">初始化FCM</button>
    <button @click="getToken">获取Token</button>
    <button @click="subscribeNews">订阅新闻主题</button>
    <button @click="unsubscribeNews">取消订阅新闻</button>
  </view>
</template>

<script setup lang="ts">
import { 
  initFCM, 
  getFCMToken, 
  subscribeTopic, 
  unsubscribeTopic, 
  onMessageReceived 
} from '@/uni_modules/ld-push/utssdk'

// 初始化FCM
const initFCMService = () => {
  initFCM({
    success: (res) => {
      uni.showToast({
        title: 'FCM初始化成功',
        icon: 'success'
      })
    },
    fail: (err) => {
      uni.showToast({
        title: 'FCM初始化失败',
        icon: 'error'
      })
    }
  })
}

// 获取Token
const getToken = () => {
  getFCMToken({
    success: (res) => {
      console.log('FCM Token:', res.token)
      uni.showToast({
        title: '获取Token成功',
        icon: 'success'
      })
    },
    fail: (err) => {
      uni.showToast({
        title: '获取Token失败',
        icon: 'error'
      })
    }
  })
}

// 订阅新闻主题
const subscribeNews = () => {
  subscribeTopic({
    topic: 'news',
    success: (res) => {
      uni.showToast({
        title: '订阅成功',
        icon: 'success'
      })
    },
    fail: (err) => {
      uni.showToast({
        title: '订阅失败',
        icon: 'error'
      })
    }
  })
}

// 取消订阅新闻
const unsubscribeNews = () => {
  unsubscribeTopic({
    topic: 'news',
    success: (res) => {
      uni.showToast({
        title: '取消订阅成功',
        icon: 'success'
      })
    },
    fail: (err) => {
      uni.showToast({
        title: '取消订阅失败',
        icon: 'error'
      })
    }
  })
}

// 监听推送消息
onMessageReceived((message) => {
  console.log('收到推送消息:', message)
  uni.showModal({
    title: message.title || '推送消息',
    content: message.body || '收到新消息',
    showCancel: false
  })
})
</script>

注意事项

  1. 确保已在Firebase控制台正确配置项目
  2. Android需要添加 google-services.json 文件
  3. iOS需要添加 GoogleService-Info.plist 文件
  4. 真机测试时需要配置正确的Bundle ID/Package Name
  5. 推送消息在应用前台时需要通过 onMessageReceived 回调处理

相关文档

隐私、权限声明

1. 本插件需要申请的系统权限列表:

通知权限

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件使用的FCMSDK要求装fcm三件套

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问