Introduction
Les notifications Push sont un outil puissant qui peut combler le fossé de communication entre vos systèmes front-end et back-end. Ces notifications offrent un canal direct et immédiat pour interagir avec les utilisateurs sur les plateformes web et mobiles. Que vous gériez une application web, une application mobile, ou une combinaison des deux, la mise en place de notifications Push peut améliorer l’engagement des utilisateurs et fournir des mises à jour en temps réel, rendant votre application plus pertinente et conviviale pour les utilisateurs.
Dans le contexte d’une API REST, une notification Push pourrait vous permettre d’être informé à chaque fois qu’un nouvel utilisateur s’inscrit sur votre application, par exemple.
Dans ce guide complet, nous vous guiderons à travers le processus de mise en place des notifications Push avec une API REST, en couvrant à la fois les aspects back-end et front-end. À la fin de ce tutoriel, vous disposerez des connaissances et des outils nécessaires pour envoyer des messages personnalisés et opportuns à vos utilisateurs, les tenant informés, engagés et les incitant à revenir pour plus.
Partie Back-End
Nous ne passerons pas en revue le processus de mise en place d’une API REST, mais vous pouvez le faire en utilisant Spring Boot, Node.js, ou tout autre framework web de votre choix. Pour ce tutoriel, nous utiliserons Spring, mais les méthodes décrites ici sont facilement adaptables à d’autres frameworks.
Le processus global d’envoi d’une notification Push consiste à effectuer une requête POST vers les serveurs Firebase, avec une charge JSON qui ressemble à ceci :
{ "to": "deviceToken"
"notification":{
"title": "notification Title"
"body": "Body",
"mutable_content": "true" } }oici une description des paires clé-valeur dans l’objet JSON :
- “to” : C’est l’endroit où vous spécifiez le jeton FCM (Firebase Cloud Messaging) du périphérique cible. Il indique la destination de la notification Push.
- “notification” : Il s’agit d’un objet contenant les détails de la notification à afficher.
- “title” : Le titre de la notification, souvent affiché en haut de la notification.
- “body” : Le corps ou le contenu de la notification.
- “mutable_content” : Ce champ indique si le contenu de la notification est modifiable. Une notification mutable vous permet de mettre à jour ou de modifier le contenu de la notification après qu’elle a été reçue par le périphérique. Le définir sur “true” signifie que le contenu peut être modifié.
Vous devrez également récupérerer la clef serveur à l’adresse suivante:
https://console.firebase.google.com
ous trouverez la clé du serveur, que vous pouvez copier et utiliser dans vos requêtes.
Ensuite, vous devez effectuer une requête POST vers l’URL suivante, avec le payload JSON spécifié ci-dessus :
https://fcm.googleapis.com/fcm/send
Vous devrez également définir la clé du serveur en tant qu’en-tête.
À titre de référence, voici une méthode pour créer une telle requête dans Spring Boot :
public void sendPushNotification(String serverKey,String deviceToken,String title, String body){
String fcmUrl = "https://fcm.googleapis.com/fcm/send";
//Define the json payload:
Map<String, Object> message = new HashMap<>();
message.put("to", deviceToken);
Map<String, Object> notification = new HashMap<>();
notification.put("title", title);
notification.put("body", body);
notification.put("mutable_content", "true");
message.put("notification", notification);
try {
URL url = new URL(fcmUrl);
HttpURLConnection conn = (HttpURLConnection) url.openConnection();
// Set the request method to POST
conn.setRequestMethod("POST");
// Set the authorization header with your FCM server key
conn.setRequestProperty("Authorization", "key=" + serverKey);
// Set the content type to JSON
conn.setRequestProperty("Content-Type", "application/json");
// Enable input and output streams
conn.setDoOutput(true);
// Convert the message map to a JSON string
String jsonMessage = new Gson().toJson(message);
// Write the JSON payload to the output stream
try (OutputStream os = conn.getOutputStream()) {
byte[] input = jsonMessage.getBytes("utf-8");
os.write(input, 0, input.length);
}
// Get the HTTP response code
int httpResponseCode = conn.getResponseCode();
System.out.println("FCM HTTP Response Code: " + httpResponseCode);
// Handle the response as needed
if (httpResponseCode == 200) {
System.out.println("Message sent successfully");
} else {
System.out.println("Error sending message");
}
conn.disconnect();
} catch (Exception e) {
e.printStackTrace();
}
}A quoi correspond le device token ?
Le jeton du périphérique (device token) est un identifiant unique attribué à un périphérique spécifique auquel vous prévoyez d’envoyer la notification. Ce jeton permet au serveur de notification, comme Firebase Cloud Messaging (FCM), de cibler précisément le périphérique destinataire de la notification.
Intégration Frontend
Pour utiliser Firebase dans votre projet, ajoutez la ligne suivante dans votre fichier de configuration de projet (généralement le fichier build.gradle) sous la section des plugins :
id ‘com.google.gms.google-services’ version ‘4.4.0’ apply false
Dans votre fichier build.gradle de niveau de module (généralement le fichier build.gradle de votre application), ajoutez la dépendance suivante dans la section des plugins :
id ‘com.google.gms.google-services’
Pour ajouter des dépendances à votre fichier build.gradle de niveau de module, vous pouvez ajouter des lignes dans la section dependencies. Voici un exemple de comment ajouter des dépendances pour Firebase :
implementation ‘com.google.firebase:firebase-messaging:23.2.1’
implementation platform(‘com.google.firebase:firebase-bom:32.2.2’)
implementation ‘com.google.firebase:firebase-analytics-ktx’
Retournez à la console Firebase et accédez à l’onglet “Général” dans les paramètres du projet
Sous la section de votre projet Firebase, vous pouvez ajouter une application:
Une fois que vous avez suivi les étapes pour ajouter une application à votre projet Firebase, vous devriez pouvoir accéder à un fichier appelé google-services.json. Ce fichier de configuration est spécifique à votre application et contient les informations nécessaires pour que votre application communique avec les services Firebase.
Recevoir les notifications Push
Dans votre classe Application (habituellement nommée MyApplication ou un nom similaire), vous devrez ajouter la ligne suivante dans la méthode onCreate() :
FirebaseApp.initializeApp(this);Pour obtenir le jeton (token) FCM (Firebase Cloud Messaging):
public void FireBaseTokenGenerator(){
FirebaseMessaging.getInstance().getToken().addOnCompleteListener(task -> {
if (!task.isSuccessful()) {
Log.w("TAG", "Fetching FCM registration token failed", task.getException());
return;
}
// Get the registration token
token = task.getResult();
// TODO: Send this token to your REST API
});
}Vous pouvez ensuite envoyer ce jeton à votre API et le stocker pour l’utiliser au moment opportun.
Afficher et recevoir des notifications
Pour gérer les notifications, vous devrez créer une classe de service qui étend FirebaseMessagingService.
Dans ce service, remplacez la méthode onMessageReceived(RemoteMessage remoteMessage). Cette méthode sera déclenchée à chaque réception d’une notification push.
Pour récupérer les informations que vous avez envoyées via votre API, vous pouvez utiliser :
remoteMessage.getNotification().getTitle();
et
remoteMessage.getNotification().getBody();
Pour utiliser ce service, vous pouvez l’enregistrer dans votre fichier AndroidManifest.xml comme suit :
<service
android:name=".YourPushService"
android:exported="true">
<intent-filter>
<action android:name="com.google.firebase.MESSAGING_EVENT"></action>
</intent-filter>
</service>Et voilà, vous devriez maintenant être en mesure de configurer des notifications Push avec votre API REST et d’envoyer des notifications personnalisées aux utilisateurs lorsque certains événements sont déclenchés.
Si vous avez des questions, n’hésitez pas à les poser dans les commentaires ci-dessous ou à nous contacter à l’adresse suivante :
Lizard & Dog Blog 
Leave a comment