1. 10:02 12/10/2026
**Tổng quan**
Thông báo đẩy là yếu tố then chốt để giữ chân người dùng và tăng tỷ lệ quay lại. Với Firebase Cloud Messaging (FCM) bạn có thể gửi thông báo đến cả trình duyệt (thông qua Service Worker) và ứng dụng di động chỉ bằng một mã nguồn chung.
**1. Cấu hình dự án Firebase**
- Tạo project trên Firebase Console → Cloud Messaging.
- Bật "Web Push certificates" (VAPID key) cho PWA.
- Tải file `google-services.json` (Android) và `GoogleService-Info.plist` (iOS) vào thư mục gốc của React Native.
**2. Cài đặt thư viện**
```bash
# Web
npm i firebase
# React Native
npm i @react-native-firebase/app @react-native-firebase/messaging
```
**3. Khởi tạo FCM chung**
Tạo file `firebase.js` export `messaging` instance. Trên web dùng `getMessaging()` và `getToken({ vapidKey })`. Trên native dùng `messaging().registerDeviceForRemoteMessages()`.
**4. Yêu cầu quyền người dùng**
- Web: `Notification.requestPermission()` trước khi lấy token.
- Native: `messaging().requestPermission()` (iOS) và kênh thông báo (Android).
**5. Xử lý thông báo khi ứng dụng ở foreground**
- Web: `onMessage(messaging, (payload) => { … })`.
- Native: `messaging().onMessage(async remoteMessage => { … })`.
Hiển thị UI tùy chỉnh (toast, modal) thay vì hệ thống mặc định để thống nhất trải nghiệm.
**6. Xử lý background / killed state**
- Web: Service Worker `firebase-messaging-sw.js` với `onBackgroundMessage`.
- Native: `messaging().setBackgroundMessageHandler`.
Đảm bảo payload chứa `data` để bạn điều hướng deep‑link khi người dùng bấm.
**7. Gửi thông báo từ server**
Sử dụng Admin SDK (Node.js, Python, Go) gọi `send({ token, notification, data })`. Có thể gửi theo topic (`/topics/news`) để broadcast.
**8. Kiểm thử và debug**
- Dùng Firebase Console → Cloud Messaging → "Send test message".
- Log token trên thiết bị thật và emulator.
- Kiểm tra quyền thông báo trên iOS (capabilities Push Notifications).
**Mẹo thực chiến**
- Lưu token vào backend kèm userId để gửi cá nhân hóa.
- Xoá token khi user đăng xuất hoặc thu hồi quyền.
- Sử dụng `data-only` message để tránh hiển thị đôi trên iOS.
- Áp dụng exponential backoff khi đăng ký token thất bại.
Với các bước trên bạn có một hệ thống push notification thống nhất, dễ bảo trì và sẵn sàng mở rộng cho cả PWA và React Native.