Enviar uma imagem no payload da notificação

A API FCM HTTP v1 e o Editor do Notificações são compatíveis com o envio de links de imagem no payload de uma notificação de exibição. O download da imagem poderá ser feito no dispositivo depois da entrega. Há um limite de 1 MB no tamanho das imagens de notificações, as maiores são restringidas de acordo com as imagens aceitas nativamente pelo Android.

Criar a solicitação de envio

Defina a seguinte opção do AndroidConfig na sua solicitação de envio de notificação:

  • notification.image contendo o URL da imagem

A solicitação de envio a seguir envia um título de notificação comum para todas as plataformas, mas também envia uma imagem. Este é um exemplo do efeito visual no dispositivo de um usuário:

Desenho simples de uma imagem em uma notificação de exibição

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

Para saber mais, consulte a página de referência HTTP v1 para mais detalhes sobre as chaves disponíveis em blocos específicos da plataforma no corpo da mensagem.

Com notification definido conforme exibido, essa solicitação de envio permite que o cliente de que receber a mensagem gerencie o envio no payload.