Flutter ทำ push notify by Firebase 1

• ครั้งก่อนเขียนเกี่ยวกับการทำ push notify เมื่อเรากดปุ่มบน app เรา
• วันนี้จะลองคือ ไม่ต้องกดปุ่มแล้วสั่ง online มาแล้วให้แสดง push notify โดยใช้ความสามารถนี้ผ่าน Firebase service (Cloud Messaging)

Pre

• ก่อนอื่นเลยอย่าลืม add Firebase config ใน Flutter 
• ขั้นต่อไป คือเตรียมโค้ดทำ Local push notify เตรียมไว้รอ
• จากนั้นมาเพิ่มส่วนโค้ดเกี่ยวกับ firebase messaging กัน

Step

• เพิม dependencies firebase_massging กับ firebase_core ใน pubspec.yaml
• ตามด้วยคำสั่ง flutter pub get

• import firebase_messaging.dart

• ประกาศตัวแปร FirebaseMessaging

• ที่นี้เพิ่มโค้ดเกี่ยวกับรอรับ Messaging จาก Firebase ประมาณนี้ (โค้ดเดิม Local push notify คงไว้)

initFirebaseMessaging();

void initFirebaseMessaging() {
    firebaseMessaging.configure(
      onMessage: (Map message) async {
        print("onMessage: $message");
        Map mapNotification = message["notification"];
        String title = mapNotification["title"];
        String body = mapNotification["body"];
        sendNotificationOnline(title: title, body: body);
      },
      onLaunch: (Map message) async {
        print("onLaunch: $message");
      },
      onResume: (Map message) async {
        print("onResume: $message");
      },
    );
    firebaseMessaging.requestNotificationPermissions(
        const IosNotificationSettings(sound: true, badge: true, alert: true));
    firebaseMessaging.onIosSettingsRegistered
        .listen((IosNotificationSettings settings) {
      print("Settings registered: $settings");
    });
    firebaseMessaging.getToken().then((String token) {
      assert(token != null);
      print("Token : $token");
    });
  }

• สร้าง sendMessaging สำหรับทำงานเมื่อ Message เข้ามาใน onMessage

• ถ้าลองรันดูแล้ว รันได้แต่ exception ประมาณนี้

[firebase_core_web , firebase_auth_web, cloud_firestore_web ] 

• เข้าไปแก้ไขที่ android -> setting-gradle

def flutterProjectRoot = rootProject.projectDir.parentFile.toPath()
def plugins = new Properties()
def pluginsFile = new File(flutterProjectRoot.toFile(), '.flutter-plugins')
if (pluginsFile.exists()) {
    pluginsFile.withReader('UTF-8') { reader -> plugins.load(reader) }
}
plugins.each { name, path ->
    def pluginDirectory = flutterProjectRoot.resolve(path).resolve('android').toFile()
    include ":$name"
    project(":$name").projectDir = pluginDirectory
}

• ทดสอบรันอีกครั้งถ้าสำเร็จเราจะได้ Token key จาก Firebase แบบนี้ ในหน้าต่างด้านล่าง

Ref

• https://medium.com/firebasethailand/%E0%B8%A3%E0%B8%B9%E0%B9%89%E0%B8%88%E0%B8%B1%E0%B8%81-firebase-cloud-messaging-fcm-%E0%B8%95%E0%B8%B1%E0%B9%89%E0%B8%87%E0%B9%81%E0%B8%95%E0%B9%88-zero-%E0%B8%88%E0%B8%99%E0%B9%80%E0%B8%9B%E0%B9%87%E0%B8%99-hero-fb7900af92cd
• https://benzneststudios.com/blog/flutter/how-to-integrate-firebase-messaging-in-flutter/
• https://benzneststudios.com/blog/flutter/how-to-use-local-notification-in-flutter/
• https://github.com/FirebaseExtended/flutterfire/issues/2599