Android Code : ทำ Push Notification ด้วย Firebase Cloud Messaging ตอนที่ 2
ตอนที่ 1 พูดเรื่องของการ สมัคร Firebase , ติดตั้ง Firebase ใน Android project และ push ด้วย Firebase console
Android Code : ทำ Push Notification ด้วย Firebase Cloud Messaging ตอนที่ 1
การยิงไปที่ Firebase
ความจริงแล้วการส่ง Notification มันคือการยิง POST ไปที่ server ของ Firebase ซึ่งเป็นตัวกลางในการส่ง และเราจะต้องส่งเป็น json ไปด้วย เราจึงสามารถใช้โปรแกรม POST MAN , เขียนโค้ด php หรือใช้ AJAX ยิงได้เหมือนกัน ขอเรียกว่ายิงแบบ manual ละกัน
ลิงค์ที่รับ request ของ Firebase จงจำลิงค์นี้ไว้ให้ดี
https://fcm.googleapis.com/fcm/send
Server Key
การส่งแบบ manual เอง หรือยิงเอง ต้องใช้ server key ด้วย วิธีการก็ให้ไปที่ Project settings
เลือกแถบ Cloud Messaging
ก็จะพบกับ Firebase Clound Messaging ให้ทำการ copy เอาไว้
จะเห็นว่าด้านล่างมี Server key ด้วย อันนี้ใช้ได้เหมือนกัน แต่กำลังจะถูกยกเลิกไป
ลองยิงด้วย POST MAN
คราวนี้มาลองยิงด้วยโปรแกรทดสอบ API ยอดนิยม ไม่รู้จักนี่ จัดว่าบาปมาก เพื่อดูว่ามันสามารถยิงเองได้จริงๆนะ
ใครไม่มีก็ให้โหลด POST MAN บน Chrome extensions
https://chrome.google.com/webstore/detail/postman/fhbjgbiflinjbdggehcddcbncdddomop?hl=en-US
ต่อมาก็ให้เปิดโปรแรม เลือก Dropdown เป็น POST
ใส่ URL ของ firebase ลงไป
ที่ แถบ Header ใส่ ข้อมูลลงไปดังภาพ
คือส่วน Authorization แปะ “key=” ตามด้วย Firebase Clound Messaging key (มี key= ข้างหน้าด้วย)
https://fcm.googleapis.com/fcm/send Content-Type:application/json Authorization:key=AIzaSyB3N..9XC_KTB5CdtIc9....
เลื่อนมาที่แถบ Body
ให้เลือก raw แล้วแปะ json ลงไป โดย value ของ to ก็คือ token ของผู้รับ
จากนั้นกดยิงได้เลย ที่ปุ่ม Send
{ "to" : "c5O-A1Fkrxo:APA91bGttyJfmq12ZsVsxJN33CgzaSK7UyozxeZUhxfMQ6tabzswqnGQoVkdWypoq3JS_eMNcbgbkbJG9-ZFW8f3cG5Vho0TfLh5xoRFb2Gdsi5o7R8Yw4El3bLD6qvHVig3FpOyP4G1.... "notification" : { "body" : "ฆ่ามันซะ !!!", "title" : "เจ้ามังกรของข้า", "icon" : "ic_launcher" "color":"#f1c40f" } }
และนี่คือผลลัพธ์ ที่ Firebase ส่งกลับมา ถ้าเห็น succes 1 ละ ก็แสดงว่าข้อความถูกส่งไปแล้ว
ซึ่งก็มีส่งมาจริงๆ
ยิงด้วย Php
ผมลองเขียนแบบยิงด้วย php แบบ native ก็ทำได้เหมือนกัน ยิงบน localhost ก็ได้
ใครไม่ชอบเขียน php ก็ข้ามไปเลยจ้า
<?php $api_url = "https://fcm.googleapis.com/fcm/send"; $server_key = "key=AIzaSyB3NtpSTk9XC_KTB5CdtI...."; $token_target ="c5O-A1Fkrxo:APA91bGttyJfmq12ZsVsxJN33CgzaSK7UyozxeZUhxfMQ6tabzswqnGQoVkdWypoq3JS_eMNcbgbkbJG9-ZFW8f3cG5Vho0TfLh5xoRFb2Gdsi5o7R8Yw4El3bL..."; $color = "#f1c40f"; $title ="ขอให้พลังสถิตกับเจ้า"; $body = "และสถิตย์กับเจ้าด้วย"; $json = "{ \"to\" : \"$token_target\", \"priority\" : \"high\", \"notification\" : { \"body\" : \"$body\", \"title\" : \"$title\", \"icon\" : \"ic_launcher\" \"color\" : \"$color\" } }"; $context = stream_context_create(array( 'http' => array( 'method' => "POST", 'header' => "Authorization: ".$server_key."\r\n". "Content-Type: application/json\r\n", 'content' => "$json" ) )); $response = file_get_contents($api_url, FALSE, $context); if($response === FALSE){ die('Error'); }else{ echo $response; } ?>
การแจ้งเตือนก็ถูกยิงมา แล้ว
ยิงด้วย AJAX
การยิงด้วย ajax ก็ทำได้ง่ายๆ
ก่อนอื่น include jquery ด้วย จะได้ใช้ Ajax ได้ ถ้าไม่มีก็ไปโหลดมาให้เรียบร้อย
ผมจะทำโดยสร้าง form HTML แบบง่ายๆ เอาไว้กรอก พอกดปุ่ม send แล้ว ก็ยิงออกไป
<script src="jquery.min.js"></script> <body> <h2>Test firebase send notification.</h2> <table> <tr><td>Token target</td><td><input type="text" id="txt_token"></td></tr> <tr><td>Title </td><td><input type="text" id="txt_title"></td></tr> <tr><td>Body </td><td><input type="text" id="txt_body"></td></tr> <tr><td><button id="btn_send">Send</button></td></tr> </table>
ได้ฟอร์มแบบง่ายแล้วๆ
เขียน javascript โดยใช้ jquery ดึงพวก ข้อมูลจาก text box ออกมา พร้อม handle พวก onClick ให้เรียบร้อย
จากนั้นก็ให้เรียก AJAX ส่ง POST ไป พร้อมข้อมูลที่แปลงเป็น json
<script type="text/javascript"> $("#btn_send").click(function(){ sendNotification(); }); function sendNotification(){ var token = $("#txt_token").val(); var title = $("#txt_title").val(); var body = $("#txt_body").val(); var obj = { "to": token, "priority": "high", "notification" : {"body":body, "title":title, "icon":"ic_launcher" ,"color" :"#f1c40f"} } $.ajax({ type: "post", url: "https://fcm.googleapis.com/fcm/send", contentType: "application/json;", headers: { "Authorization": "key=AIzaSyB3NtpSTk9XC_KTB5CdtIc9FlUWp1OtRIg" }, data: JSON.stringify(obj), success: function(data) { console.log("Success"); alert("success"); }, error: function(data){ console.log("error "); alert("error"); } }); } </script>
ลองรันดูเลยจ้า
รู้จัก collapse_key
collapse_key คือ การจัดกลุ่มให้กับข้อมูลที่ส่งไป มาดูประโยชน์ของมันกัน สมมุติ เรามีแจ้งเตือนส่งไปหาลูกค้า ในระยะเวลา 1 อาทิตย์ ส่งไป 20 อัน แต่ดันมี user คนนึง 1 อาทิตย์ที่ผ่านมาไม่ได้เปิดมือถือเลย พึ่งจะมาเปิดวันนี้ เกิดอะไรขึ้น?
ถ้าเราไม่ตั้ง collapse_key ไว้ อาจจะเกิดเหตุการณ์แบบนี้กับ user คนนั้น ตู้มๆ โดนยิงรัวๆ จะไปวัดหรือไปโรงพยาบาลดี
ซึ่งมันก็ดี ถ้าแจ้งเตือนนั้นสำคัญทุกอัน หรือจำเป็นต้องให้ผู้ใช้คนนั้นเห็น
แต่ถ้า มันไม่ได้สำคัญอะไรมากนัก เช่น แจ้งเตือนโปรโมชัน ซึ่งวันนี้อาจหมดอายุเลย ก็ไม่มีความจำเป็นที่ต้องแสดง
การตั้ง collapse_key จะเป็นการบอกว่าถ้ามีมีอันใหม่ แล้วอันเก่าในกลุ่มเดียวกัน (มี key เดียวกัน) แล้วยังไม่ได้ส่ง ให้ก็ส่งเฉพาะอันใหม่ เมื่อ user online
พอ User คนนั้น online ก็จะได้รับเฉพาะข้อมูลที่ ล่าสุดของแต่ละ collapse_key
ยิงทีละหลายๆ Token
ถ้าจะส่งแบบหลายๆ token ในคราวเดียวก็ใช้วิธีการเปลี่ยน key จาก to เป็น registration_ids ส่วน token ก็ใส่เป็น array ไป
{ "registration_ids":["Token1","Token2","Token3"], "priority" : "high", "notification" : { "body" : "Starwar IX is coming", "title" : "Your favorie movie, "icon" : "ic_launcher" } }
กำหนดอายุของข้อความ
เราสามารถกำหนดอายุของมันได้ โดยใช้ time_to_live
"time_to_live" : 3000
โดยค่าของมันมีหน่วย วินาที มีได้มากที่สุด 2,419,200 หรือประมาณ 4 อาทิตย์
เช่น
{ "registration_ids":["Token1","Token2","Token3"], "priority" : "high", "notification" : { "body" : "great match!", "title" : "Portugal vs. Denmark", "icon" : "myicon" }, "time_to_live" : 3000 }
อาจจะเหมาะสำหรับ การแจ้งเตือน event หรือโปรโมชันอะไรสักอย่าง ถ้าผู้ใช้ปิดเครื่อง แล้วมาเปิดอีกที แต่เวลาหมดอายุ ก็จะไม่ได้รับข้อความ ซึ่งก็จัดว่าถูกต้องแล้ว
ขอจบตอนที่ 2 นี้ก่อน บทความนี้ไม่ได้เกี่ยวกับ Android มากนัก แต่มันก็เชื่อมโยงกันนั่นแหละ
ตอนหน้าจะทำการส่งแบบ data แล้วก็ handle ใน Android จ้า
ขอบคุณครับ
(:
Android Code : ทำ Push Notification ด้วย Firebase Cloud Messaging ตอนที่ 3