Wednesday, July 8, 2020

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

No comments:

Post a Comment