更新记录
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配置
- 在Firebase控制台创建项目并下载
google-services.json
文件 - 将
google-services.json
文件放到项目根目录的nativeResources/android
目录下
iOS配置
- 在Firebase控制台创建项目并下载
GoogleService-Info.plist
文件 - 将
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>
注意事项
- 确保已在Firebase控制台正确配置项目
- Android需要添加
google-services.json
文件 - iOS需要添加
GoogleService-Info.plist
文件 - 真机测试时需要配置正确的Bundle ID/Package Name
- 推送消息在应用前台时需要通过
onMessageReceived
回调处理