Firebase cloud messaging set web push notify to Google Chrome & Safari

ใช้ firebase เป็น service ในการส่งเข้า web notify สำหรับ เครื่อง android

• https://www.youtube.com/watch?v=ulYnmSbgeq8
• https://www.youtube.com/watch?v=iz5arafmatc
• https://www.youtube.com/watch?v=5gls_e1JyeY

สำหรับ IOS IPadOS

• https://www.youtube.com/watch?v=G6n4FxuhiJo
• https://firebase.blog/posts/2023/08/fcm-for-safari/
• https://stackoverflow.com/questions/76493356/notification-requestpermission-not-prompting-allow-deny-on-ios-safari-16-5
• https://www.xda-developers.com/how-enable-safari-notifications-iphone/

เพิ่มเติม

• IOS สำคัญต้องมี manifesh.json => { "display": "standalone"  } หรือ { "display": "fullscreen" }

<link rel="manifest" href="https://mysite/path/manifest.json">

• สำหรับตั้งค่า icon เมื่อเพิ่มเข้าหน้า home screen

<link rel="apple-touch-icon" href="https://mysite/path/images/logo_bg_white.png">

• IOS หรือ IpadOS  ต้อง 16.4+ และ Safari 16.1+
• อ้างอิง บน IPadOS 18.1, IOS 18.1
• ตั้งค่าให้ safari Enable notification โดย Setting => Apps => Safari => Advanced => Feature Flags => Notifications
• จากนั้น เปิด Safari เข้าไป site แล้ว share แบบ Add to Home Screen (เครื่องหมายชี้ขึ้น ข้างๆ เครื่องหมายบวกเพิ่ม tab) ถ้าไม่เพิ่ม to home screen จะ request permission ไม่ผ่าน denie ตลอด
• โค้ดฝั่ง server ต้องสร้าง ปุ่มสำหรับ request permission (ลอง settimeout หรือ trigger click permission denied ทั้งหมด ต้องกดปุ่มเองเท่านั้นจริงจะ granted)