【第十七天 - Flutter Cloud Messaging(上)】

前言

今日的程序码 => GITHUB

这次要来介绍 Flutter 的 Cloud Messaging 推播功能,因为手上刚好没有 IOS 的 developer account,因此这篇主要介绍 Android 的 Cloud Messaging 部分。

今日的内容

  • 会有两个 js 档案,一个 JS 是执行 boardcast 发送给全部的手机 device,第二个是执行订阅者方式,只传送给有订阅这个 topic 的人,Topic 要在 JS 手动改(预设为 channel1)。
  • 会将使用者已定订阅的频道写入 fireStore。
  • 处理 ternimal 开启(当 app 完全被 kill 掉後接收到通知)、background 开启(app 缩小时接收到通知)、foreground 开启(正在使用 app 收到通知),这三种情况。
  • 传送 data 到通知里面,当我点选通知後,那道 data 里面的资料,进而跳到我想要的页面。
  • 注意:这篇文章、范例,并没有去做 device_token 的删除。

教学网站

推播分成两种

  • In App Messaging(前景推播): 当app处於 activ阶段时,所传送的推播。
  • Cloud Messaging(背景推播):当app处於「background」、「suspended」或是「not running」阶段时,所传送的推播。

FCM 功能分为两种

预期性推播

可以直接从 Firebase 介面直接让我们设定『固定周期』或是『指定特定日期时间』的推播。可以设定推播的标题、文字、图片、转换事件、音效开关等等~

https://ithelp.ithome.com.tw/upload/images/20210909/20134548jAHHVrdIrN.png

即时事件推播

当事件触发时,传送讯息给指定用户,类似 youtube 的订阅者。例如:当 userA 发文时,传送推播给订阅 userA 的使用者。

  1. 记录使用者的device token,根据device token发送推播。
  2. 传送推播给 topic,有 subscribe 该 topic 的使用者就会收到该推播。白话一点就是:使用者的手机订阅 youtuber,而 youtuber 只要发文,所有有订阅该 youtuber 的手机都可以马上收到通知。

开始吧~

连结 Firebase

1.Firebase注册登入後,建立一个新的 project。
2.
https://ithelp.ithome.com.tw/upload/images/20210909/20134548vv73BytNFL.png
3. 去 project/android/app/src/AndroidManifest.xml,把 com.example.XXX 复制到下方贴上(下方图片已 com.example.day_18 作为范例,因为 17 的我已经注册过了。)

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.day_17">

https://ithelp.ithome.com.tw/upload/images/20210909/20134548NU6yL5i2j1.png
4. 下载 google-services.json
5. project/android/build.grandle

classpath 'com.google.gms:google-services:4.3.5'
  1. project/android/app/build.grandle
apply plugin: 'com.google.gms.google-services'

    implementation platform('com.google.firebase:firebase-bom:26.8.0')
    implementation 'com.google.firebase:firebase-analytics-ktx'
  1. 连接完成。

设定 YAML 套件

  flutter_local_notifications: ^8.1.1+2
  firebase_core: ^1.6.0
  firebase_messaging: ^10.0.6
  cloud_firestore: ^2.5.1

设定 FireStore

https://ithelp.ithome.com.tw/upload/images/20210909/20134548JMuB1M68uC.pnghttps://ithelp.ithome.com.tw/upload/images/20210909/20134548FmgSDuiPR7.png

使用 Cloud Messaging

https://ithelp.ithome.com.tw/upload/images/20210909/20134548sJacMKDfjf.pnghttps://ithelp.ithome.com.tw/upload/images/20210909/20134548JvwQp2vTNp.png

点击 Sent Test,可以指定传送给某一台手机的 device。

https://ithelp.ithome.com.tw/upload/images/20210909/20134548F7ryaoMLAD.png

选择 Apphttps://ithelp.ithome.com.tw/upload/images/20210909/20134548s6E36kzqVM.png

最後一个可以传入特殊的资料,这边需要传入 key = route,value = secondPage,这样当我点击通知的时候,就可以跳到指定的 secondPage 了。
https://ithelp.ithome.com.tw/upload/images/20210909/2013454824C6Akwlrd.png

下载 ServiceAccountKey.json

下载并重新命名成 serviceaccountKey.json,并放到专案目录底下 ./serviceAccountKey.json

https://ithelp.ithome.com.tw/upload/images/20210909/20134548RUYngljlVf.png

推播和 Firebase 连接就先讲到这边,明天谈谈 JS 档案还有 Flutter 专案好了
那我们铁人赛 Day18 见罗!!


<<:  DAY16:Pytorch transforms(上)

>>:  [Day 16] 实作-图片轮播 Carousels

Day-9 重现於新电视的音速索尼克始祖、SEGA 的 MEGA DRIVE

我想就算没玩过游戏、应该也多少听过去年上映的音速小子电影、这是部由 SEGA 游戏音速小子(现译为索...

我与程序的距离-Day2

不难发现,问题在於该用什麽标准来做决定呢?梁晓声曾讲过,友谊,好比一瓶酒,封存的时间越长,价值则越高...

近似最短路径 (7)

11.6a 把树合并起来 让我们简单描述一下把树合并起来的过程,补上昨天 Peleg’s Dista...

Day16-打包自己的 Go package

前言 在前面的文章,有稍微解说 Go 语言的 package 的机制,有内建套件或是第三方提供的套件...

DAY 27 如何使用PyImgur

获得已上传图片资讯 修改自官网范例 import pyimgur CLIENT_ID = "...