Enviar una imagen en la carga de notificación

La API FCM HTTP v1 y el compositor de notificaciones admiten el envío de enlaces de imágenes en la carga útil de una notificación en pantalla, para descargar la imagen en el dispositivo después de la entrega. Las imágenes para notificaciones están limitadas a 1 MB de tamaño y, de lo contrario, están restringidas por la compatibilidad con imágenes nativas de Android.

Construya la solicitud de envío

En su solicitud de envío de notificación, configure la siguiente opción de AndroidConfig :

  • notification.image que contiene la URL de la imagen

El siguiente ejemplo de solicitud de envío envía un título de notificación común a todas las plataformas, pero también envía una imagen. A continuación se muestra una aproximación del efecto visual en el dispositivo de un usuario:

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

Nodo.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);
  });

DESCANSAR

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"
       }
     }
   }
 }

Consulte la documentación de referencia de HTTP v1 para obtener detalles completos sobre las claves disponibles en bloques específicos de la plataforma en el cuerpo del mensaje.

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