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. É possível fazer o download da imagem 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

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

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

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 a documentação de referência do HTTP v1 para ver 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.