碼農日常大小事

今天來到FCM的下篇的部分

在上篇碼農日常-『Android studio』FCM雲端推播與通知系統(上)-建立第一個基本推播通知APP中

我已經為我們的APP建立了一個FCM的基礎系統

但是！英文叫做But!!

請問在實際開發上，你會真的叫行銷人員每次都開那個網頁來發送推播訊息嗎Σ(°ロ°)

我看他還不打死你??

一般在開發上，我們在做這類功能時通常還會做一個「後台系統」以供行銷人員方便使用

而今天要來講的有兩個重點: 

1. 使用Postman模擬後端發送

2. 手機接到通知後，點擊它即可直接前往我所指定的網站

為什麼我要用Postman模擬呢？因為其實網路上還蠻多人的教學都是直接去寫一個後端來使用

但是...

攤手┐(‘～` )┌

講到後端閒聊一下，其實像我來講我因為有一些別的需求，實際上我自己是有租後端的

而租金來說的話其實也是1年6000台幣，實際上有那麼點貴(還好它對我來說是會賺錢的)

但其實我了解了一下身邊的工程師朋友，我發現有在認真研究的人也會自己租後端研究

所以大家不妨可以考慮看看租一個玩歐！

那如過真的有興趣，其實也是可以在本地端直接開一個Serve（像是xampp、Apache、Node.js等等），使用localhost做測試一樣可行的

OK回來

總之，反正我就懶，所以直接用Postmam模擬發送吧

來看看以下範例

了解範例後再來是Github(Postman的內容寫在Readme)

->https://github.com/thumbb13555/FCM_Example

1. 找出FCM的發送key

首先要了解，FCM的發送是可以透過後端的程式碼執行的

也就是說你時常看到仿間應用程式有通知的功能，多數都是靠此完成

這部分可以搭配著文件一起看

->https://firebase.google.com/docs/cloud-messaging/http-server-ref

文件中有描述到了你的API發送的body格式，那部分由於範圍太廣了，所以今天的範例只取一部分使用

那麼，關於Http的發送除了Body帶資料外，還有Headers需要做身份上的驗證，於是，我們就必須得先找到專屬於你的key

首先，請先來到設定主頁->專案的部分

找到你的應用程式（紅框處），點擊它

然後點擊齒輪，進到專案設定

複製下來你的金鑰，再來我們來到Postman

2. 設定Postman

首先請去下載Postman

->https://www.postman.com/

當然，你要用網頁版的也是可以

請新增一個新的

會看到一個全新的request

再來，請填入基本URL，並將傳輸方式設定為「Post」

再來切到Headers的部分，填入3個Hearders

我的Github中的Readme都有寫入哪裡該填什麼，可以參考一下

->https://github.com/thumbb13555/FCM_Example/blob/master/README.md#%E6%8C%87%E5%AE%9A%E6%9F%90%E8%A3%9D%E7%BD%AE%E7%99%BC%E9%80%81

比較需要注意的是是伺服器金鑰的部分

這邊再填入的時候，請務必寫上"key=(你的伺服器金鑰)"，請特別要注意歐

然後切到Body的部分，點選raw，在空白處貼上我在Github內給你的body

OK，寫到這邊就完成後端的發送設定了

接著我們回到Android專案，來到FCMService.java的部分，目前在onMessageReceived底下應該只有一個Log，那們我們來發送看看

@SuppressLint("UnspecifiedImmutableFlag")
@Override
public void onMessageReceived(@NonNull RemoteMessage remoteMessage) {
    super.onMessageReceived(remoteMessage);
    Log.d(TAG, "onMessageReceived: " + remoteMessage.getData());

}

這時候你就會在你的Logcat內找到你剛剛發送的內容囉！

現在後端的發送完成了，接著要來寫手機接收的部分囉:D

3. 設置通知

現在，你已經能夠在Logcat看到訊息了，但是我們要實際轉為通知要怎麼做呢?

其實，我之前有寫過一篇

->碼農日常-『Android studio』Notification通知之用法(含點擊事件)

就是為了今天的主題鋪路的XD

來來來，我直接給你程式看看

FCMServices.java

public class FCMService extends FirebaseMessagingService {
    public static final String TAG = FCMService.class.getSimpleName()+"My";
    private String CHANNEL_ID = "Coder";
    public FCMService() {}

    @Override
    public void onNewToken(@NonNull String s) {
        super.onNewToken(s);
        Log.d(TAG, "裝置Token: "+s);
    }

    @SuppressLint("UnspecifiedImmutableFlag")
    @Override
    public void onMessageReceived(@NonNull RemoteMessage remoteMessage) {
        super.onMessageReceived(remoteMessage);
        Log.d(TAG, "onMessageReceived: " + remoteMessage.getData());
        //從這邊開始往下
        /**檢查手機版本是否支援通知；若支援則新增"頻道"*/
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
            NotificationChannel channel = new NotificationChannel(
                    CHANNEL_ID, "DemoCode", NotificationManager.IMPORTANCE_DEFAULT);
            NotificationManager manager = getSystemService(NotificationManager.class);
            assert manager != null;
            manager.createNotificationChannel(channel);

        }
        Map<String,String> s = remoteMessage.getData();
        Intent intent = new Intent(this,NotificationTarget.class);
        intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TASK);
        intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
        intent.putExtra("data",s.get("key_1"));
        PendingIntent pendingIntent = PendingIntent.getActivity(this,0
                ,intent,PendingIntent.FLAG_UPDATE_CURRENT);

        /**建置通知欄位的內容*/
        NotificationCompat.Builder builder
                = new NotificationCompat.Builder(FCMService.this,CHANNEL_ID)
                .setSmallIcon(R.drawable.ic_baseline_fiber_new_24)
                .setContentTitle(s.get("title"))
                .setContentText(s.get("body"))
                .setAutoCancel(true)
                .setPriority(NotificationCompat.PRIORITY_HIGH)
                .setCategory(NotificationCompat.CATEGORY_MESSAGE)
                .setContentIntent(pendingIntent);

        /**發出通知*/
        NotificationManagerCompat notificationManagerCompat
                = NotificationManagerCompat.from(FCMService.this);
        notificationManagerCompat.notify(1,builder.build());
        //到這邊
      }
}

基本上整段複製就可以了XD

不過還是有個重點做個講解

那就是橘底白字的部分

這部分其實就是銜接下一段的「跳轉網頁事件」有關

這個地方是設置一個Intent，告訴Meaage說我稍後點擊到通知時，我會將頁面跳轉至NotificationTarget這個Activity內的意思

並且還有把從body內取得的資料帶上，一併傳入

到這裡大家也可以執行看看，寫到這裡應該就會有通知顯示囉

然後藍底白字的部分，這個地方我上面沒有寫載入圖片，因此這裡會報錯，請特別注意了！(所以你就自己載入圖片吧XD)

到此一樣在執行看看，就可以看到通知

且按下通之後她會跳轉到NotificationTarget.java這個Activity內喔！

4. 點擊後導向網頁

其實，做到上一步驟就已經差不多結束了，那一段就是將收到的資訊直接轉到網頁去而已

看程式便能很清楚地了解囉

NotificationTarget.java

public class NotificationTarget extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_notification_target);
        String result = getIntent().getStringExtra("data");

        TextView tvResult = findViewById(R.id.textView_Result);
        tvResult.setText("收到訊息：\n"+result);

        Intent intent = new Intent();
        intent.setAction(Intent.ACTION_VIEW);
        intent.setData(Uri.parse(result));
        startActivity(intent);
        finish();

    }
}

對，就是一個很簡單的網頁跳轉，沒了攤手)

好啦，也不要說我寫得太隨便

結語

本篇的FCM系列就到這邊

實際上這系列也是個我很之前就想寫的系列，但無奈一直無法付出實際(笑)

因為這部分的東西，程式雖然不多但是設定一大堆，有夠麻煩

而且Google其實有事沒事就會改他的UI，有可能我今天寫完後，然後又會有人問我「為什麼我找不到功能??」這類的問題

可是Google也很無奈呀XD因為他們一直都在把東西推陳出新，為了達到最好的UI效果，就...只好改惹QQ

好啦，那文章就寫到這邊，感謝大家點閱！