รับลิงก์แบบไดนามิกของ Firebase ในแอป Flutter

หากต้องการรับลิงก์แบบไดนามิกของ Firebase ที่ คุณสร้างขึ้น, คุณต้องรวม Dynamic Links SDK ไว้ในแอปและเรียกใช้เมธอด FirebaseDynamicLinks.getDynamicLink() เมื่อแอปโหลดเพื่อ รับข้อมูลที่ส่งผ่านในลิงก์แบบไดนามิก

ตั้งค่า Firebase และ Dynamic Links SDK

1. ติดตั้งและเริ่มต้นใช้งาน Firebase SDK สำหรับ Flutter หากคุณ ยังไม่ได้ดำเนินการ

2. จากไดเรกทอรีรากของโปรเจ็กต์ Flutter ให้เรียกใช้คำสั่งต่อไปนี้เพื่อติดตั้งปลั๊กอิน Dynamic Links

   flutter pub add firebase_dynamic_links
   

3. หากคุณกำลังสร้างแอป Android ให้เปิดหน้าการตั้งค่าโปรเจ็กต์ ของคอนโซล Firebase และตรวจสอบว่าคุณได้ระบุคีย์การลงนาม SHA-1 แล้ว หากคุณใช้ App Link ให้ระบุคีย์ SHA-256 ด้วย

พาร์ทเนอร์การรวมบริการแพลตฟอร์ม

ทำตามขั้นตอนการผสานรวมแพลตฟอร์มต่อไปนี้สำหรับแพลตฟอร์มที่คุณกำลังสร้างแอป

Android

ใน Android คุณต้องเพิ่มตัวกรอง Intent ใหม่เพื่อดักจับ Deep Link ของโดเมน เนื่องจากลิงก์แบบไดนามิกจะเปลี่ยนเส้นทางไปยังโดเมนของคุณหากมีการติดตั้งแอป คุณต้องดำเนินการนี้เพื่อให้แอปได้รับข้อมูลลิงก์แบบไดนามิกหลังจากที่ติดตั้ง/อัปเดตจาก Play Store และผู้ใช้แตะปุ่ม "ดำเนินการต่อ" ใน AndroidManifest.xml ให้ทำดังนี้

<intent-filter>
    <action android:name="android.intent.action.VIEW"/>
    <category android:name="android.intent.category.DEFAULT"/>
    <category android:name="android.intent.category.BROWSABLE"/>
    <data
        android:host="example.com"
        android:scheme="https"/>
</intent-filter>

เมื่อผู้ใช้เปิดลิงก์แบบไดนามิกที่มี Deep Link ไปยัง Scheme และโฮสต์ที่คุณระบุ แอปจะเริ่มกิจกรรมด้วยตัวกรอง Intent นี้เพื่อจัดการลิงก์

ขั้นตอนถัดไปคือตรวจสอบว่าได้ลงทะเบียนลายนิ้วมือ SHA-256 ของใบรับรองการลงนามในคอนโซล Firebase สำหรับแอปแล้ว คุณดูรายละเอียดเพิ่มเติมเกี่ยวกับวิธีดึงข้อมูลลายนิ้วมือ SHA-256 ได้ในหน้า การตรวจสอบสิทธิ์ไคลเอ็นต์

แพลตฟอร์มของ Apple

1. สร้างบัญชีนักพัฒนาแอปของ Apple หากยังไม่มี

2. ในหน้าการตั้งค่าโปรเจ็กต์ ของคอนโซล Firebase ให้ตรวจสอบว่าแอป iOS ได้รับการกำหนดค่าอย่างถูกต้องด้วยรหัส App Store และรหัสทีม

3. สร้างโปรไฟล์การจัดสรรสำหรับแอปของคุณโดยเปิดใช้ความสามารถของโดเมนที่เชื่อมโยงในเว็บไซต์นักพัฒนาแอปของ Apple

4. ใน Xcode ให้ทำดังนี้

   1. เปิดแอปในส่วนหัว TARGETS

   2. ในหน้าการลงนามและความสามารถ ให้ตรวจสอบว่าได้ลงทะเบียนทีมและตั้งค่าโปรไฟล์การจัดสรรแล้ว

   3. ในหน้าการลงนามและความสามารถ ให้เปิดใช้โดเมนที่เชื่อมโยง แล้วเพิ่มรายการต่อไปนี้ลงในรายการโดเมนที่เชื่อมโยง (แทนที่ example ด้วยโดเมนของคุณ)

      applinks:example.page.link
      

   4. ในหน้าข้อมูล ให้เพิ่มประเภท URL ลงในโปรเจ็กต์ ตั้งค่าช่อง URL Schemes เป็นรหัสชุดของแอป (ตัวระบุอาจเป็น Bundle ID หรืออะไรก็ได้ตามต้องการ)

   5. หากคุณตั้งค่าโดเมนที่กำหนดเองสำหรับโปรเจ็กต์ Firebase ให้เพิ่มคำนำหน้า URL ของลิงก์แบบไดนามิกลงในไฟล์ Info.plist ของโปรเจ็กต์ iOS โดยใช้คีย์ FirebaseDynamicLinksCustomDomains

      <?xml version="1.0" encoding="UTF-8"?>
      <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
      <plist version="1.0">
      <dict>
      <key>FirebaseDynamicLinksCustomDomains</key>
      <array>
          <string>https://custom.domain.io/path1</string>
          <string>https://custom.domain.io/path2</string>
      </array>
      
      ...other settings
      
      </dict>
      </plist>
      

   6. ไม่บังคับ: ปิดใช้ SDK ของลิงก์แบบไดนามิกในการใช้คลิปบอร์ดของ iOS

      โดยค่าเริ่มต้น Dynamic Links SDK จะใช้คลิปบอร์ดเพื่อปรับปรุงความน่าเชื่อถือของ Deep Link หลังการติดตั้ง การใช้คลิปบอร์ดช่วยให้ลิงก์แบบไดนามิกมั่นใจได้ว่าเมื่อผู้ใช้เปิดลิงก์แบบไดนามิกแต่ต้องติดตั้งแอปก่อน ผู้ใช้จะไปยังเนื้อหาที่ลิงก์ไว้เดิมได้ทันทีเมื่อเปิดแอปเป็นครั้งแรกหลังการติดตั้ง

      ข้อเสียคือการใช้คลิปบอร์ดจะทริกเกอร์การแจ้งเตือนใน iOS 14 ขึ้นไป ดังนั้น เมื่อผู้ใช้เปิดแอปเป็นครั้งแรก หากคลิปบอร์ดมี URL ของลิงก์แบบไดนามิก ผู้ใช้จะเห็นการแจ้งเตือนว่าแอปของคุณเข้าถึงคลิปบอร์ด ซึ่งอาจทำให้เกิดความสับสน

      หากต้องการปิดใช้ลักษณะการทำงานนี้ ให้แก้ไขไฟล์ Info.plist ของโปรเจ็กต์ Xcode และตั้งค่าคีย์ FirebaseDeepLinkPasteboardRetrievalEnabled เป็น NO

จัดการ Deep Link

หากต้องการจัดการลิงก์แบบไดนามิกในแอปพลิเคชัน คุณต้องติดตั้งใช้งาน 2 สถานการณ์ต่อไปนี้

สถานะสิ้นสุด

ตั้งค่าเมธอดต่อไปนี้

1. FirebaseDynamicLinks.getInitialLink - แสดงผล Future<PendingDynamicLinkData?>
2. FirebaseDynamicLinks.onLink - ตัวแฮนเดิลเหตุการณ์ที่แสดงผล Stream ซึ่งมี PendingDynamicLinkData?

Android จะได้รับลิงก์ผ่าน FirebaseDynamicLinks.getInitialLink จากสถานะสิ้นสุดเสมอ แต่ใน iOS ไม่รับประกัน ดังนั้น คุณควรตั้งค่าทั้ง 2 อย่างตามลำดับต่อไปนี้เพื่อให้แอปพลิเคชันได้รับลิงก์

Future<void> main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(options: DefaultFirebaseConfig.platformOptions);

  // Check if you received the link via `getInitialLink` first
  final PendingDynamicLinkData? initialLink = await FirebaseDynamicLinks.instance.getInitialLink();

  if (initialLink != null) {
    final Uri deepLink = initialLink.link;
    // Example of using the dynamic link to push the user to a different screen
    Navigator.pushNamed(context, deepLink.path);
  }

  FirebaseDynamicLinks.instance.onLink.listen(
        (pendingDynamicLinkData) {
          // Set up the `onLink` event listener next as it may be received here
          if (pendingDynamicLinkData != null) {
            final Uri deepLink = pendingDynamicLinkData.link;
            // Example of using the dynamic link to push the user to a different screen
            Navigator.pushNamed(context, deepLink.path);
          }
        },
      );

  runApp(MyApp(initialLink));
}

จากนั้นคุณสามารถตรวจสอบได้ว่ามีการจัดการลิงก์แล้วหรือไม่ และดำเนินการ เช่น

if (initialLink != null) {
  final Uri deepLink = initialLink.link;
  // Example of using the dynamic link to push the user to a different screen
  Navigator.pushNamed(context, deepLink.path);
}

สถานะเบื้องหลัง / เบื้องหน้า

ขณะที่แอปพลิเคชันเปิดอยู่หรืออยู่ในเบื้องหลัง ให้ใช้ Getter FirebaseDynamicLinks.onLink ดังนี้

FirebaseDynamicLinks.instance.onLink.listen((dynamicLinkData) {
  Navigator.pushNamed(context, dynamicLinkData.link.path);
}).onError((error) {
  // Handle errors
});

หรือหากต้องการระบุว่ามีการใช้ลิงก์แบบไดนามิกที่แน่นอนเพื่อเปิดแอปพลิเคชัน ให้ส่งลิงก์นั้นไปยังเมธอด getDynamicLink แทน

String link = 'https://dynamic-link-domain/ke2Qa';

final PendingDynamicLinkData? initialLink = await FirebaseDynamicLinks.instance.getDynamicLink(Uri.parse(link));

การทดสอบลิงก์แบบไดนามิกในแพลตฟอร์ม iOS

หากต้องการทดสอบลิงก์แบบไดนามิกใน iOS คุณต้องใช้อุปกรณ์จริง นอกจากนี้ คุณยังต้องเรียกใช้แอปในโหมดเผยแพร่ (เช่น flutter run --release) หากทดสอบลิงก์แบบไดนามิกจากสถานะแอปที่สิ้นสุด (เช่น ปิดแอปด้วยการปัด)