Cómo usar Firebase Cloud Messaging (FCM) con browser.gcm

Puedes enviar y recibir mensajes a los usuarios finales con browser.gcm. Dado que se basa en Firebase Cloud Messaging (FCM), depende de un servicio externo que debes configurar. En esta guía práctica, se explican todos los pasos necesarios para que funcione en tu extensión.

Si bien browser.gcm aún se admite, se creó hace más de una década, antes del estándar Push. En general, siempre es mejor usar el estándar web que una API específica de la extensión. A menos que tengas una necesidad específica de usar browser.gcm, te recomendamos que uses Push.

Requisitos previos

Para usar browser.gcm, deberás configurar una cuenta de Firebase.

Página principal de Firebase.com
Página principal de Firebase.com

Una vez que hayas creado una cuenta, deberás abrir Firebase console y seleccionar un proyecto existente para usarlo o crear uno nuevo para tu extensión.

Captura de pantalla de la lista de proyectos en Firebase console.
Listados de proyectos en Firebase console

Continúa a la página de configuración de Cloud Messaging.

Captura de pantalla de una página de configuración de Firebase Cloud Messaging.
Página de configuración de Firebase Cloud Messaging

Si tienes una cuenta existente de mensajería en la nube en este proyecto, copia el ID del remitente numérico que se indica.

Si no tienes habilitado Cloud Messaging, deberás habilitar la API de Firebase Cloud Messaging para el proyecto en Google Cloud. En la siguiente imagen, puedes ver dónde hay un vínculo directo a esta página en la configuración de Firebase.

Captura de pantalla de la ubicación del vínculo para habilitar la API de Firebase Messaging en Google Cloud.
Cómo abrir el vínculo de configuración de Google Cloud en Firebase

Una vez que lo habilites, regresa a la página de configuración de Cloud Messaging y copia el ID del remitente.

Configura browser.gcm

Ahora que tienes tu ID de remitente de Firebase, puedes configurar tu extensión para que escuche mensajes. Para comenzar, asegúrate de haber agregado el permiso gcm al manifest.json de tu extensión.

  {
    "manifest_version": 3,
    ...
    "permissions": ["gcm"]

Ahora tienes acceso a la API de browser.gcm. Puedes registrarte para escuchar mensajes push llamando a browser.gcm.register.

Escuchar mensajes

Una vez que la extensión haya registrado tu ID del remitente, debes agregar código para controlar los mensajes entrantes.

Firebase sin Firebase

Si bien browser.gcm siempre pasa por Firebase, Firebase se puede configurar para que actúe como proxy para proveedores externos de mensajería push. Por lo general, los proveedores indicarán explícitamente la compatibilidad con las extensiones de Chrome. Sin embargo, debería funcionar cualquier proveedor que admita las notificaciones push heredadas de Firebase. Si tu proveedor indica que admite las notificaciones push heredadas de Firebase, pruébalas. Si tienes problemas, el equipo de asistencia de los proveedores debería poder aclarar cualquier restricción que se aplique.

Sobre los canales y los temas

browser.gcm usa las APIs heredadas de Firebase Messaging. Esto es importante porque la API heredada no admite canales de mensajes. Cada mensaje enviado se dirigirá a todos los clientes. Si la extensión de un usuario solo está interesada en un subconjunto de mensajes, deberás filtrar por tu cuenta.

Si bien Firebase comienza como una cuenta gratuita, se te cobrará una vez que superes un cierto límite de uso. Si planeas enviar mensajes a grupos específicos, es posible que el filtrado del cliente termine costando más de lo que se justifica. Para evitar este problema, puedes crear varios proyectos para replicar canales individuales (un proyecto y un ID de remitente para cada canal). Cualquier extensión puede registrarse para varios IDs de remitente, hasta 100.

Como alternativa, si necesitas compatibilidad con canales o quieres usar notificaciones push sin pasar por Firebase, puedes usar la API de Push.