Envía una imagen en la carga útil de la notificación

La API de HTTP v1 de FCM y el Compositor de Notifications admiten el envío de vínculos de imágenes en la carga útil de una notificación en pantalla para la descarga de imágenes en el dispositivo después de la entrega. Las imágenes de notificaciones están limitadas a 1 MB de tamaño; si se excede este límite, la compatibilidad de imágenes nativa de Android las restringirá.

Crea la solicitud de envío

En tu solicitud de envío de notificaciones, configura la siguiente opción de AndroidConfig:

  • notification.image que contiene la URL de la imagen

En el siguiente ejemplo de solicitud de envío, se envía tanto el título de notificación común a todas las plataformas como una imagen. Esta es una aproximación del efecto visual en el dispositivo de un usuario:

Dibujo simple de una imagen en una notificación en pantalla

Node.js

const topicName = 'industry-tech';

const message = {
  notification: {
    title: 'Sparky says hello!'
  },
  android: {
    notification: {
      imageUrl: 'https://foo.bar.pizza-monster.png'
    }
  },
  apns: {
    payload: {
      aps: {
        'mutable-content': 1
      }
    },
    fcm_options: {
      image: 'https://foo.bar.pizza-monster.png'
    }
  },
  webpush: {
    headers: {
      image: 'https://foo.bar.pizza-monster.png'
    }
  },
  topic: topicName,
};

getMessaging().send(message)
  .then((response) => {
    // Response is a message ID string.
    console.log('Successfully sent message:', response);
  })
  .catch((error) => {
    console.log('Error sending message:', error);
  });

REST

POST https://fcm.googleapis.com/v1/projects/myproject-b5ae1/messages:send HTTP/1.1

Content-Type: application/json
Authorization: Bearer ya29.ElqKBGN2Ri_Uz...HnS_uNreA
{
  "message":{
     "topic":"industry-tech",
     "notification":{
       "title":"Sparky says hello!",
     },
     "android":{
       "notification":{
         "image":"https://foo.bar/pizza-monster.png"
       }
     },
     "apns":{
       "payload":{
         "aps":{
           "mutable-content":1
         }
       },
       "fcm_options": {
           "image":"https://foo.bar/pizza-monster.png"
       }
     },
     "webpush":{
       "headers":{
         "image":"https://foo.bar/pizza-monster.png"
       }
     }
   }
 }

Consulta la documentación de referencia de HTTP v1 para obtener información detallada sobre las claves disponibles en los bloques específicos de la plataforma del cuerpo del mensaje.

Con la notification configurada como se muestra, esta solicitud de envío permite que el cliente receptor controle la imagen entregada en la carga útil.