หากต้องการเริ่มต้นใช้งาน FCM ให้สร้างกรณีการใช้งานที่เรียบง่ายที่สุด นั่นคือการส่ง ข้อความการแจ้งเตือนทดสอบจาก การเขียนการแจ้งเตือนไปยังอุปกรณ์การพัฒนา เมื่อแอปอยู่ในเบื้องหลังบนอุปกรณ์ หน้านี้จะแสดงขั้นตอนทั้งหมดในการดำเนินการ ตั้งแต่การตั้งค่าไปจนถึงการยืนยัน ซึ่งอาจครอบคลุมขั้นตอนที่เสร็จสมบูรณ์แล้วหากคุณตั้งค่าแอป Flutter สำหรับ FCM
ติดตั้งปลั๊กอิน FCM
ติดตั้งและเริ่มต้น Firebase SDK สำหรับ Flutter หากยังไม่ได้ทำ
จากรูทของโปรเจ็กต์ Flutter ให้เรียกใช้คำสั่งต่อไปนี้เพื่อติดตั้งปลั๊กอิน
flutter pub add firebase_messaging
เมื่อดำเนินการเสร็จแล้ว ให้สร้างแอปพลิเคชัน Flutter ใหม่โดยทำดังนี้
flutter run
เข้าถึงโทเค็นการจดทะเบียน
หากต้องการส่งข้อความไปยังอุปกรณ์ที่ต้องการ คุณต้องทราบโทเค็นการลงทะเบียนของอุปกรณ์นั้น เนื่องจากคุณจะต้องป้อนโทเค็นในช่องในคอนโซลการแจ้งเตือนเพื่อดำเนินการบทแนะนำนี้ให้เสร็จสมบูรณ์ โปรดคัดลอกโทเค็นหรือจัดเก็บอย่างปลอดภัยหลังจากเรียกกลับมา
หากต้องการเรียกข้อมูลโทเค็นการลงทะเบียนปัจจุบันสำหรับอินสแตนซ์ของแอป ให้เรียกใช้ getToken()
หากไม่มีการให้สิทธิ์การแจ้งเตือน วิธีนี้จะช่วยขอสิทธิ์การแจ้งเตือนจากผู้ใช้ มิฉะนั้น ระบบจะแสดงผลโทเค็นหรือปฏิเสธในอนาคตเนื่องจากเกิดข้อผิดพลาด
final fcmToken = await FirebaseMessaging.instance.getToken();
ส่งข้อความแจ้งเตือนทดสอบ
ติดตั้งและเรียกใช้แอปในอุปกรณ์เป้าหมาย บนอุปกรณ์ Apple คุณจะต้องยอมรับ คำขอสิทธิ์เพื่อรับการแจ้งเตือนระยะไกล
ตรวจสอบว่าแอปอยู่ในเบื้องหลังของอุปกรณ์
เปิดหน้าการรับส่งข้อความในคอนโซล Firebase
หากนี่เป็นข้อความแรก ให้เลือกสร้างแคมเปญแรก
- เลือกข้อความแจ้งเตือน Firebase แล้วเลือกสร้าง
หรือเลือกแคมเปญใหม่ในแท็บแคมเปญ แล้วเลือกการแจ้งเตือน
ป้อนข้อความที่ต้องการ ส่วนช่องอื่นๆ ทั้งหมดไม่บังคับ
เลือกส่งข้อความทดสอบจากแผงด้านขวา
ในช่องเพิ่มโทเค็นการจดทะเบียน FCM ให้ป้อนโทเค็นการลงทะเบียนที่คุณได้รับในส่วนก่อนหน้าของคู่มือนี้
เลือกทดสอบ
หลังจากเลือกทดสอบแล้ว อุปกรณ์ของลูกค้าเป้าหมาย (ที่มีแอปอยู่ในเบื้องหลัง) จะได้รับการแจ้งเตือน
ดูข้อมูลเชิงลึกเกี่ยวกับการส่งข้อความไปยังแอปของคุณได้ที่แดชบอร์ดการรายงาน FCM ซึ่งจะบันทึกจำนวนข้อความที่ส่งและเปิดในอุปกรณ์ Apple และ Android พร้อมทั้งข้อมูล "การแสดงผล" (การแจ้งเตือนที่ผู้ใช้เห็น) สำหรับแอป Android
การจัดการการโต้ตอบ
เมื่อผู้ใช้แตะการแจ้งเตือน ลักษณะการทำงานเริ่มต้นทั้งใน Android และ iOS คือเปิดแอปพลิเคชัน หากแอปพลิเคชันถูกยกเลิก ระบบจะเริ่มต้นใช้งาน และหากแอปอยู่ในเบื้องหลัง แอปจะถูกย้ายมาที่เบื้องหน้า
คุณอาจต้องจัดการกับการโต้ตอบของผู้ใช้เมื่อแอปพลิเคชันเปิด ทั้งนี้ขึ้นอยู่กับเนื้อหาของการแจ้งเตือน ตัวอย่างเช่น หากมีการส่งข้อความแชทใหม่โดยใช้การแจ้งเตือนและผู้ใช้เลือกข้อความดังกล่าว คุณอาจต้องเปิดการสนทนาที่ต้องการเมื่อแอปพลิเคชันเปิดขึ้น
แพ็กเกจ firebase-messaging
มี 2 วิธีในการจัดการการโต้ตอบนี้ ได้แก่
getInitialMessage()
: หากแอปพลิเคชันเปิดจากสถานะสิ้นสุด ระบบจะแสดงผลFuture
ที่มีRemoteMessage
เมื่อใช้แล้ว ระบบจะนำRemoteMessage
ออกonMessageOpenedApp
:Stream
ที่โพสต์RemoteMessage
เมื่อแอปพลิเคชันเปิดขึ้นจากสถานะเบื้องหลัง
คุณควรดำเนินการทั้ง 2 กรณีเพื่อให้ผู้ใช้ได้รับประสบการณ์การใช้งานที่ราบรื่น โค้ดตัวอย่างด้านล่างจะสรุปวิธีดำเนินการ
class Application extends StatefulWidget {
@override
State<StatefulWidget> createState() => _Application();
}
class _Application extends State<Application> {
// In this example, suppose that all messages contain a data field with the key 'type'.
Future<void> setupInteractedMessage() async {
// Get any messages which caused the application to open from
// a terminated state.
RemoteMessage? initialMessage =
await FirebaseMessaging.instance.getInitialMessage();
// If the message also contains a data property with a "type" of "chat",
// navigate to a chat screen
if (initialMessage != null) {
_handleMessage(initialMessage);
}
// Also handle any interaction when the app is in the background via a
// Stream listener
FirebaseMessaging.onMessageOpenedApp.listen(_handleMessage);
}
void _handleMessage(RemoteMessage message) {
if (message.data['type'] == 'chat') {
Navigator.pushNamed(context, '/chat',
arguments: ChatArguments(message),
);
}
}
@override
void initState() {
super.initState();
// Run code required to handle interacted messages in an async function
// as initState() must not be async
setupInteractedMessage();
}
@override
Widget build(BuildContext context) {
return Text("...");
}
}
วิธีที่คุณใช้จัดการการโต้ตอบจะขึ้นอยู่กับการตั้งค่าแอปพลิเคชันของคุณ ตัวอย่างด้านบนแสดงตัวอย่างพื้นฐานของการใช้ StatefulWidget
ขั้นตอนถัดไป
ส่งข้อความไปยังแอปที่ทำงานอยู่เบื้องหน้า
เมื่อคุณส่งข้อความการแจ้งเตือนสำเร็จขณะที่แอปทำงานอยู่เบื้องหลัง โปรดดูหัวข้อรับข้อความในแอป Flutter เพื่อเริ่มส่งไปยังแอปที่ทำงานอยู่เบื้องหน้า
ทำได้มากกว่าแค่ข้อความแจ้งเตือน
หากต้องการเพิ่มลักษณะการทำงานขั้นสูงอื่นๆ ในแอป คุณจะต้องใช้งานเซิร์ฟเวอร์
จากนั้นให้ทำตามขั้นตอนต่อไปนี้ในไคลเอ็นต์ของแอป