给Flutter + FireBase 增加 badge 徽章,App启动器 通知红点。

在此之前需要配置好 firebase 在flutter 在项目中。(已经配置好的可以忽略此提示)

Firebase 配置教程:flutter + firebase 云消息通知教程 (android-安卓、ios-苹果)_flutter firebase_messaging ios环境配置-CSDN博客

 由于firebase 提供的消息通知测试只能做简单设置。所以这里需要自己搭建一个服务。

一、测试服务器搭建:

        1. 来到 fireBase 控制台,进入需要搭建的项目。(生成私钥)

               

        2.服务器环境-> 向特定设备发送消息

        

        官方文档给了六种服务器配置信息。以下例子采用 NestJs(Nodejs)进行快速搭建一个服务器。(搭建过程忽略)

        在搭建好的项目中 安装 firebase-admin 依赖 (Linux, MacOs 命令前需要加 sudo 提高权限)

npm i firebase-admin

        把上面在firebase 生成私钥 json 文件 复制到src文件夹下 并在service中引用。

        

service 代码  :

import { Injectable } from '@nestjs/common';import * as admin from 'firebase-admin';
import * as serviceAccount from './serviceAccountKey.json';
import { ApiTags } from '@nestjs/swagger';const app = admin.initializeApp({credential: admin.credential.cert({projectId: serviceAccount.project_id,clientEmail: serviceAccount.client_email,privateKey: serviceAccount.private_key})
});// 此处放上 firebase 为你生成的 token
let token: string = 'dAevBHOOS9GtQwWQ5ffhtU:APA91bGlc_35hvVYzV18-Ok0-ejWJvGzwrvdoMGTZSuXSxSX_k_5ZrCyLU9HrAZZZsCH9cSjwdAVFoXsKzP0H2qTBBTUaHRTZ7bgijIevdnCiiQ7UGG7qRwM3Kyh5XrGl89G8GU1NLoQ';@ApiTags('App')
@Injectable()
export class AppService {async sendMessage(): Promise<string> {const message = {notification: {title: 'iwinvApp notification test2',body: 'body content',},data: {score: '850',time: '2:45'},apns: {payload: {aps: { // ios 设置徽章显示数字badge: 4,sound: 'default'}}},token: token};return await app.messaging().send(message)}
}

     执行命令 启动服务:注意main.ts 中的 listen(Numbr) 中的端口号。

npm run start:dev

此时可以访问连接 http://127.0.0.1:3000/ (3000是你自己的端口号) 也可利用postman进行访问测试 (此例子中在Nestjs中安装了 swagger 进行测试)

二、Android徽章问题:

对于支持应用图标徽章的 Android 设备制造商,当设备接收到 Firebase Cloud Messaging(FCM)推送通知时,往往会自动增加应用图标上的徽章数量。这种自动递增或增加徽章的行为通常是设备制造商或 Android 系统的默认行为,而无需应用程序代码进行特殊处理。

但是,这种行为可能会因设备制造商和 Android 版本而异。不同的制造商可能会有自己的徽章实现方式或默认行为。因此,虽然大多数支持徽章的 Android 设备在接收到 FCM 通知时会自动增加徽章数量,但在特定设备或情况下可能会有例外。

如果徽章功能对你的应用很重要,建议在支持的设备上进行详细的测试,以确保通知行为符合你的预期,并准备好处理任何可能的差异或问题。

安卓支持徽章的机型厂商 >> GitHub - leolin310148/ShortcutBadger: An Android library supports badge notification like iOS in Samsung, LG, Sony and HTC launchers.

三、flutter_app_badger  flutter 应用内使用

flutter_app_badger 插件地址>> https://pub.dev/packages/flutter_app_badger

安装插件:

flutter pub add flutter_app_badger

 ios 需要在 info.plist 中增加以下配置:

<key>UIBackgroundModes</key><array><string>remote-notification</string></array>

// 引入插件
import 'package:flutter_app_badger/flutter_app_badger.dart';// 增加徽章调用方法
FlutterAppBadger.updateBadgeCount(1);// 移除徽章方法 (ios 支持)
FlutterAppBadger.removeBadge();// 检查当前设备是否支持徽章功能 (异步)FlutterAppBadger.isAppBadgeSupported();

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/325558.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Tecplot 各版本安装指南

Tecplot下载链接 https://pan.baidu.com/s/1XbzjHnho8zIF7eC4KBFmgA?pwd0531 1.鼠标右击【Tecplot 360 EX 2023(64bit)】压缩包&#xff08;win11及以上系统需先点击“显示更多选项”&#xff09;【解压到 Tecplot 360 EX 2023(64bit)】。①解压前&#xff1a;需要先关闭“所…

x-cmd pkg | pdfcpu - 强大的 PDF 处理工具

目录 简介首次用户多功能支持性能表现安全的加密处理进一步阅读 简介 pdfcpu 是一个用 Go 编写的 PDF 处理库。同时它也提供 API 和 CLI。pdfcpu 提供了丰富的 PDF 操作功能&#xff0c;用户还能自己编写配置文件&#xff0c;用来管理和使用各种自定义字体并存储有效的默认配置…

Spark入门案例

Spark shell简介 启动 Spark shell 进入 Spark 安装目录后执行 spark-shell - -master master就可以提交Spark任务Spark shell 的原理是把每一行Scala代码编译成类&#xff0c;最终交由Spark执行 Master 地址的设置 Master的地址可以有如下几种设置方式 地址解释local[N]使…

【大数据进阶第三阶段之Hive学习笔记】Hive安装

目录 1、环境准备 2、下载安装 3、配置环境变量 4、配置文件 4.1、配置hive-env.sh ​编辑4.2、配置hive-site.xml 5、上传配置jar 6、启动 1、环境准备 安装hadoop 以及 zookeeper、mysql 【大数据进阶第二阶段之Hadoop学习笔记】Hadoop 运行环境搭建-CSDN博客 《z…

pygame学习(二)——绘制线条、圆、矩形等图案

导语 pygame是一个跨平台Python库(pygame news)&#xff0c;专门用来开发游戏。pygame主要为开发、设计2D电子游戏而生&#xff0c;提供图像模块&#xff08;image&#xff09;、声音模块&#xff08;mixer&#xff09;、输入/输出&#xff08;鼠标、键盘、显示屏&#xff09;模…

云原生战专题 | 深入浅出分析云原生微服务的技术结构和架构设计

深入浅出分析云原生微服务的技术结构和架构设计 云原生容器技术背景容器编排Kubernetes控制平面的四大组件Kubernetes在容器编排中的设计要点 云原生微服务典型架构第一代微服务架构第二代微服务架构第三代微服务架构第四代微服务架构 未来的云原生架构 — Serverless 云原生容…

thinkphp学习04-控制器定义

控制器&#xff0c;即 controller&#xff0c;控制器文件存放在 controller 目录下&#xff1b; 如果想改变系统默认的控制器文件目录&#xff0c;可以在 config 下 route.php 配置&#xff1a; 将controller修改为controller123&#xff0c;就会报错&#xff0c;说明这个配置…

阿里云迁移AWS视频点播技术攻坚

文章目录 &#x1f437; 背景&#x1f9a5; 简述&#x1f425; Aws服务&#x1f99c; AWS CloudFormation&#x1f41e; 问题&#x1f409; 落地方案&#x1f989; Aws vs Aliyun&#x1f344; 避坑指南 &#x1f437; 背景 由于AWS整体成本略低于阿里云&#xff0c;公司决定将…

用C语言实现完全平方数计算【一题一策】第三期

题目&#xff1a;一个整数&#xff0c;它加上100后是一个完全平方数&#xff0c;再加上 168 又是一个完全平方数&#xff0c;请问该数是多少&#xff1f; 一、题目分析 首先假设该数为x&#xff0c;则x100y?&#xff0c;y为完全平方数。 然后加上168又是一个完全平方数&…

密码学(一)

文章目录 前言一、Cryptographic Primitives二、Cryptographic Keys2.1 Symmetric key cryptography2.2 asymmetric key cryptography 三、Confidentiality3.1 Symmetric key encryption algorithms3.2 asymmetric key block ciphers3.3 其他 四、Integrity4.1 symmetric key s…

选择排序!!!基础排序详解 C语言版

目录 1.什么是选择排序 2.选择排序源代码 3.优化代码 1.什么是选择排序 这是一个选择排序的流程图&#xff0c;其实很简单&#xff0c;就是每次挑选数字中最小的作为第一个 &#xff0c;直到整个数据有序就结束了 顾名思义&#xff0c;选择&#xff0c;那就是选取&#xff0c…

数据库期末重点

第一章&#xff1a; 1.数据库发展的三个阶段 第一代数据库系统、第二代数据库系统、新一代数据库系统 2.数据库系统发展的三个里程碑 IMS系统、DBTG报告、关系数据库系统 3.数据管理技术三个阶段 人工管理阶段(40年代中-50年代中) 文件系统阶段(50年代末-60年代中) 数据…