Rich Notification : définition, contenu multimédia et création de notifications

Qu'est-ce que Rich Notification

Rich Notification est une notification push iOS qui contient non seulement du texte, mais aussi des pièces jointes multimédia, des éléments interactifs et une interface personnalisée. Le terme « rich » (riche) reflète la capacité d'inclure des images, des vidéos, de l'audio, des boutons d'action et une saisie de texte dans une notification, transformant une simple alerte en un élément interactif à part entière.

Évolution des notifications dans iOS

Apple a introduit la prise en charge de Rich Notification dans iOS 10 avec le framework UserNotifications. Avant cela, les notifications push ne pouvaient contenir que du texte, du son et un badge. iOS 10 a présenté UNNotificationServiceExtension et UNNotificationContentExtension, qui ont ouvert la possibilité de modifier le contenu et de créer des interfaces personnalisées. Les versions ultérieures ont ajouté la prise en charge de SwiftUI dans Content Extension, les GIF animés et une meilleure mise à l'échelle des médias.

Avantages par rapport aux notifications standard

Rich Notification augmente considérablement l'engagement des utilisateurs. Les études d'Apple montrent que les notifications avec images reçoivent 30 à 40 % d'interactions supplémentaires par rapport aux notifications textuelles seules. Une image de produit, un aperçu vidéo ou un bouton de réponse rapide permettent à l'utilisateur de prendre une décision directement depuis la notification sans ouvrir l'application. Cela raccourcit le chemin vers l'action cible et améliore l'expérience utilisateur.

Types de pièces jointes multimédia et leurs formats

UNNotificationAttachment prend en charge trois catégories de médias : images, vidéo et audio. Chaque type a ses propres limitations de format, de taille et de durée. Le système redimensionne automatiquement les images pour les adapter à la taille de la notification et limite la durée de la vidéo à 30 secondes pour optimiser les performances.

Images et GIF animés

Les images sont automatiquement recadrées et redimensionnées par le système pour être affichées dans les vues de notification compactes et étendues. Les GIF animés sont pris en charge à partir d'iOS 12 et sont lus automatiquement lors de la visualisation de la notification. La taille d'image recommandée est de 1024x1024 pixels, ce qui garantit un affichage net sur tous les appareils, y compris l'iPad avec son grand écran.

Pièces jointes vidéo et audio

La vidéo dans Rich Notification est lue sans son par défaut — l'utilisateur peut activer le son via le bouton du lecteur. La durée maximale de la vidéo est de 30 secondes, après quoi la lecture s'arrête. Les pièces jointes audio peuvent être utilisées pour les messages vocaux ou les aperçus sonores et sont lues en appuyant sur la notification en vue étendue.

Boutons interactifs et actions

Les actions interactives permettent à l'utilisateur d'effectuer des opérations directement depuis la notification sans ouvrir l'application. Les actions sont enregistrées via UNNotificationCategory et UNNotificationAction au lancement de l'application. Chaque action peut être en arrière-plan (sans ouvrir l'application) ou au premier plan (ouvre l'application pour terminer l'opération).

UNNotificationAction et UNTextInputNotificationAction

UNNotificationAction représente un bouton avec un titre et des modificateurs optionnels tels que requiresAuthentication (nécessite Face ID/Touch ID) ou destructive (surligné en rouge). UNTextInputNotificationAction étend cette capacité en ajoutant un champ de saisie de texte — idéal pour les réponses rapides aux messages ou commentaires. Les actions sont affichées en appuyant longuement sur la notification ou en balayant vers le bas.

Enregistrement des catégories et actions

Les catégories de notifications lient le type de contenu à un ensemble d'actions disponibles. Le processus d'enregistrement est effectué dans AppDelegate au lancement de l'application via UNUserNotificationCenter.current().setNotificationCategories. La catégorie est spécifiée sur le serveur dans le champ category du payload JSON, et le système applique automatiquement l'ensemble d'actions correspondant à la notification.

Gestion des taps sur les actions

Lorsque l'utilisateur tape sur un bouton ou envoie du texte, le système appelle le délégué UNUserNotificationCenterDelegate avec la méthode didReceive response. UNNotificationResponse contient l'identifiant de l'action et le texte saisi (pour UNTextInputNotificationAction). Sur la base de ces informations, l'application exécute la logique métier correspondante : envoie un message, confirme une action ou ouvre un écran spécifique.

Implémentation de Rich Notification en Swift

Parcourons le cycle complet de création de Rich Notification : de l'enregistrement des catégories dans AppDelegate au traitement dans Service Extension et à l'affichage. AppDelegate enregistre la catégorie avec des boutons, le serveur envoie une notification avec une URL d'image, Service Extension télécharge le média et Content Extension affiche une interface personnalisée avec des boutons.

// AppDelegate — enregistrement des catégories et actions
func application(
    _ application: UIApplication,
    didFinishLaunchingWithOptions launchOptions:
    [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {

    let replyAction = UNTextInputNotificationAction(
        identifier: "reply",
        title: "Répondre",
        options: [.authenticationRequired])

    let likeAction = UNNotificationAction(
        identifier: "like",
        title: "J'aime",
        options: [])

    let category = UNNotificationCategory(
        identifier: "social_post",
        actions: [replyAction, likeAction],
        intentIdentifiers: [],
        options: [])

    UNUserNotificationCenter.current()
        .setNotificationCategories([category])
    return true
}

Service Extension pour charger des images

Après avoir reçu une notification push avec la catégorie « social_post » et une URL d'image dans un champ personnalisé, la Service Extension est activée. L'extension télécharge l'image depuis le réseau, crée un UNNotificationAttachment avec un identifiant unique et l'ajoute au contenu. Il est important de vérifier la taille du fichier téléchargé — si elle dépasse 10 Mo, la pièce jointe ne sera pas créée et le système affichera la notification sans média.

class NotificationService: UNNotificationServiceExtension {

    override func didReceive(
        _ request: UNNotificationRequest,
        withContentHandler contentHandler:
        @escaping (UNNotificationContent) -> Void
    ) {
        let content = (request.content.mutableCopy()
            as! UNMutableNotificationContent)
        guard let urlString = content.userInfo["media-url"]
            as? String,
            let url = URL(string: urlString)
        else { contentHandler(request.content); return }

        URLSession.shared.downloadTask(with: url) {
            location, _, _ in
            guard let location = location else {
                contentHandler(content); return }
            let attachment = try! UNNotificationAttachment(
                identifier: "media", url: location,
                options: [UNNotificationAttachmentOptionsTypeHintKey:
                    "jpg"])
            content.attachments = [attachment]
            contentHandler(content)
        }.resume()
    }
}

Test de Rich Notification

Pour tester Rich Notification sans serveur, utilisez le simulateur iOS et envoyez des pushes via le terminal avec xcrun simctl push. Dans le payload, assurez-vous de spécifier mutable-content : 1 pour activer la Service Extension et la catégorie pour afficher les actions. La commande envoie un push depuis un fichier JSON directement sur le simulateur sélectionné, permettant une itération rapide sans configurer d'infrastructure serveur.

Content Extension et interface personnalisée

UNNotificationContentExtension permet de remplacer complètement l'interface de notification standard par une vue UIKit ou SwiftUI personnalisée. L'extension est activée lorsque l'utilisateur développe la notification (force touch ou balayage vers le bas) et peut contenir des boutons, des curseurs, des animations et tout autre composant d'interface. La taille de l'interface s'adapte au contenu à l'aide d'Auto Layout.

Storyboard et SwiftUI dans Content Extension

Content Extension est basé sur un storyboard avec un contrôleur de vue héritant de UIViewController. SwiftUI View est intégrée via UIHostingController à partir d'iOS 16, permettant des approches modernes de construction d'interface. Pour la rétrocompatibilité avec iOS 14–15, il est recommandé d'utiliser UIKit avec des fichiers xib. L'interface reçoit le contenu modifié de Service Extension via UNNotificationContent.

Gestion des actions utilisateur

Content Extension implémente le protocole UNNotificationContentExtension avec la méthode didReceive response. UNNotificationResponse contient des informations sur le bouton pressé ou le texte saisi. L'extension peut mettre à jour l'interface sans fermer la notification ou appeler le gestionnaire d'achèvement pour la fermer. Cela permet de créer des scénarios d'interaction rapide, comme un « j'aime » avec un retour visuel directement dans la notification.

Recommandations de conception

Apple recommande de garder Content Extension concis et fonctionnel, en évitant les éléments superflus. La hauteur maximale de la notification développée est d'environ 400 points, après quoi le contenu défile. Utilisez les polices et les espacements du système pour la cohérence avec les autres notifications. Testez sur différentes tailles d'écran pour vous assurer que l'interface s'affiche correctement à la fois sur iPhone et sur iPad.