Invia un'immagine nel payload di notifica

L'API FCM HTTP v1 e il compilatore di notifiche supportano l'invio di link alle immagini nel payload di una notifica di visualizzazione per il download delle immagini sul dispositivo dopo l'invio. Le immagini per le notifiche sono limitate a 1 MB di dimensione, altrimenti sono limitate dal supporto nativo delle immagini Android.

Crea la richiesta di invio

Nella richiesta di invio delle notifiche, imposta la seguente opzione AndroidConfig:

  • notification.image contenente l'URL dell'immagine

L'esempio seguente di richiesta di invio invia un titolo di notifica comune a tutte le piattaforme, ma invia anche un'immagine. Ecco un'approssimazione dell'effetto visivo sul dispositivo di un utente:

Disegno semplice di un'immagine in una notifica sul display

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 documentazione di riferimento HTTP v1 per informazioni dettagliate sulle chiavi disponibili nei blocchi specifici della piattaforma nel corpo del messaggio.

Con notification impostato come mostrato, questa richiesta di invio consente al client di destinazione di gestire l'immagine caricata nel payload.