Para comenzar con FCM, desarrolle el caso de uso más simple: enviar un mensaje de notificación a un usuario específico cuando la aplicación está en segundo plano en el dispositivo. Esta página enumera todos los pasos para lograr esto, desde la configuración hasta la verificación; puede cubrir los pasos que ya completó si configuró una aplicación de cliente de JavaScript para FCM.
Configurar el SDK
Si aún no lo ha hecho, agregue Firebase a su proyecto de JavaScript .
Acceder al token de registro
Cuando necesite recuperar el token de registro actual para una instancia de aplicación, primero solicite permisos de notificación al usuario con Notification.requestPermission()
. Cuando se llama como se muestra, devuelve un token si se otorga el permiso o rechaza la promesa si se deniega:
function requestPermission() { console.log('Requesting permission...'); Notification.requestPermission().then((permission) => { if (permission === 'granted') { console.log('Notification permission granted.');
FCM requiere un firebase-messaging-sw.js
. A menos que ya tenga un firebase-messaging-sw.js
, cree un archivo vacío con ese nombre y colóquelo en la raíz de su dominio antes de recuperar un token. Puede agregar contenido significativo al archivo más adelante en el proceso de configuración del cliente.
Para recuperar el token actual:
Web version 9
import { getMessaging, getToken } from "firebase/messaging"; // Get registration token. Initially this makes a network call, once retrieved // subsequent calls to getToken will return from cache. const messaging = getMessaging(); getToken(messaging, { vapidKey: '<YOUR_PUBLIC_VAPID_KEY_HERE>' }).then((currentToken) => { if (currentToken) { // Send the token to your server and update the UI if necessary // ... } else { // Show permission request UI console.log('No registration token available. Request permission to generate one.'); // ... } }).catch((err) => { console.log('An error occurred while retrieving token. ', err); // ... });
Web version 8
// Get registration token. Initially this makes a network call, once retrieved // subsequent calls to getToken will return from cache. messaging.getToken({ vapidKey: '<YOUR_PUBLIC_VAPID_KEY_HERE>' }).then((currentToken) => { if (currentToken) { // Send the token to your server and update the UI if necessary // ... } else { // Show permission request UI console.log('No registration token available. Request permission to generate one.'); // ... } }).catch((err) => { console.log('An error occurred while retrieving token. ', err); // ... });
Una vez que haya obtenido el token, envíelo a su servidor de aplicaciones y guárdelo usando su método preferido.
Enviar un mensaje de notificación de prueba
Instale y ejecute la aplicación en el dispositivo de destino. En los dispositivos Apple, deberá aceptar la solicitud de permiso para recibir notificaciones remotas.
Asegúrese de que la aplicación esté en segundo plano en el dispositivo.
En Firebase console, abra la página Mensajería .
Si este es su primer mensaje, seleccione Crear su primera campaña .
- Seleccione Mensajes de notificación de Firebase y seleccione Crear .
De lo contrario, en la pestaña Campañas , seleccione Nueva campaña y luego Notificaciones .
Introduzca el texto del mensaje. Todos los demás campos son opcionales.
Seleccione Enviar mensaje de prueba en el panel derecho.
En el campo etiquetado Agregar un token de registro de FCM , ingrese el token de registro que obtuvo en una sección anterior de esta guía.
Seleccione Prueba .
Después de seleccionar Probar , el dispositivo cliente de destino (con la aplicación en segundo plano) debería recibir la notificación.
Próximos pasos
Enviar mensajes a aplicaciones en primer plano
Una vez que haya enviado correctamente mensajes de notificación mientras su aplicación está en segundo plano, consulte Recibir mensajes en un cliente de JavaScript para comenzar a enviar a aplicaciones en primer plano.
Vaya más allá de los mensajes de notificación
Para ir más allá de los mensajes de notificación y agregar otro comportamiento más avanzado a su aplicación, consulte: