Skip to content

Notification push Web Safari Mobile (iOS et iPadOS)

Safari v16.4 prend en charge les notifications push Web mobiles, ce qui signifie que vous pouvez désormais réengager les utilisateurs mobiles avec des notifications push sur iOS et iPadOS.

Cet article vous guidera à travers les étapes requises pour configurer les notifications push mobiles pour Safari.

Étapes d’intégration

Tout d’abord, veuillez lire et suivre notre guide d’intégration des notifications push Web standard. Les étapes suivantes ne sont nécessaires que pour prendre en charge les notifications push Web sur Safari pour la prise en charge d’iOS et d’iPadOS.

Étape 1 : Créer un fichier de manifeste

Un manifeste d’application web est un fichier JSON qui contrôle la manière dont votre site web est présenté lorsqu’il est installé sur l’écran d’accueil d’un utilisateur.

Par exemple, vous pouvez définir la couleur du thème d’arrière-plan et l’icône que l’App Switcher utilise, si le rendu est en plein écran pour ressembler à une application native, ou si l’application doit s’ouvrir en mode paysage ou portrait.

Créez un nouveau fichier manifest.json dans le répertoire racine de votre site Web, avec les champs obligatoires suivants.

1
2
3
4
5
6
7
8
9

{
  "name": "your app name",
  "short_name": "your app name",
  "display": "fullscreen",
  "icons": [{
    "src": "favicon.ico",
    "sizes": "128x128",
  }]
}

La liste complète des champs pris en charge est disponible ici.

Ajouter la balise suivante <link> à l’élément <head> de votre site Web pointant vers l’endroit où votre fichier de manifeste est hébergé.

1

<link rel="manifest" href="/manifest.json" />

Étape 3 : Ajouter un service de traitement

Votre site Web doit disposer d’un fichier de service de traitement qui importe la bibliothèque de services de traitement de Braze, comme décrit dans notre guide d’intégration des notifications push Web.

Étape 4 : Ajouter à l’écran d’accueil

Contrairement aux principaux navigateurs comme Chrome et Firefox, vous n’êtes pas autorisé à demander une autorisation de notification push sur Safari iOS/iPadOS, sauf si votre site Web a été ajouté à l’écran d’accueil de l’utilisateur.

La fonctionnalité Ajouter à l’écran d’accueil permet aux utilisateurs de mettre en favori votre site Web, en ajoutant votre icône à leur précieux espace d’écran d’accueil.

Un iPhone montrant les options permettant de mettre un site web en signet et de l'enregistrer sur l'écran d'accueil

Étape 5 : Afficher l’invite de notification push native

Une fois que l’application a été ajoutée à votre écran d’accueil, vous pouvez maintenant demander une autorisation des notifications push lorsque l’utilisateur effectue une action (comme cliquer sur un bouton). Ceci peut être effectué à l’aide de la méthode requestPushPermission ou à l’aide d’un message in-app d’amorce de notification push sans code.

Une notification push demandant d'"autoriser" ou de "ne pas autoriser" les notifications

Par exemple :

1
2
3
4
5
6
7
8
9

import { requestPushPermission } from "@braze/web-sdk";

button.onclick = function(){
    requestPushPermission(() => {
        console.log(`User accepted push prompt`);
    }, (temporary) => {
        console.log(`User ${temporary ? "temporarily dismissed" : "permanently denied"} push prompt`);
    });
};

Étapes suivantes

Ensuite, envoyez-vous un message de test pour valider l’intégration. Une fois votre intégration terminée, vous pouvez utiliser nos messages d’amorce de notification push sans code pour optimiser vos taux d’abonnement aux notifications push.

Github   Modifier cette page sur GitHub
CETTE PAGE A-T-ELLE ÉTÉ UTILE?
New Stuff!