web-dev-qa-db-fra.com

Firebase FCM Notifications Ajouter une action

Comment ajouter un bouton d'action pour pousser la notification comme ceci: -enter image description here J'ai essayé cela et ça ne fonctionne pas:

=> https://firebase.googleblog.com/2018/05/web-notifications-api-support-now.html

voici ma carreaux de notification:

array
(
    "title" =>  "FCM Message",
    "body" => "This is an FCM Message",
    "click_action" => "http://example.com/",
    "icon" => "/logo.jpg",
    "actions" => array(
        0 => array(
            'title' => 'Like',
            'click_action' => 'http://example.com/?aaa=1',
            'icon' => 'icons/heart.png',
        ),
        1 => array(
            'title' => 'Unsubscribe',
            'click_action' => 'http://example.com/?aaa=2',
            'icon' => 'icons/cross.png',
        ),
    ),
);

J'ai essayé avec le message que la charge utile ne fonctionne pas aussi:

$msg = array
(
    "webpush" =>  array
    (
        "notification" =>  array
        (
            "title" =>  "Fish Photos ????",
            "body" =>  "Thanks for signing up for Fish Photos! You now will receive fun daily photos of fish!",
            "icon" =>  "firebase-logo.png",
            "image" =>  "guppies.jpg",
            "data" =>  array
            (
                "notificationType" =>  "fishPhoto",
                "photoId" =>  "123456",
            ),
            "click_action" =>  "https://example.com/fish_photos",
            "actions" =>  array(
                0 => array(
                    'title' => 'Like',
                    'action' => 'like',
                    'icon' => 'icons/heart.png',
                ),
                1 => array(
                    'title' => 'Unsubscribe',
                    'action' => 'unsubscribe',
                    'icon' => 'icons/cross.png',
                ),
            ),
        ),

    ),
);
firebase-cloud-messagingfirebase-notificationsweb-push
5
vasco.randolph

Sur Android, vous devrez utiliser une action à distance et "appliquer" à la notification. Vous trouverez ci-dessous le résumé et ici sont les détails.

public static final String NOTIFICATION_REPLY = "NotificationReply";

RemoveInput removeInput = new RemoteInput.Builder((Notification_REPLY))
    .setLabel("Approve Comments")
    .build();

Créez ensuite un Passoire pour l'action de réponse ci-dessous:

PendingIntent acceptPendingIntent = PendingIntent.getBroadcast(
    context:this,
    REQUEST_CODE_APPROVE,
    new Intent(packageContext:this,NotificationReciver.class)
        .putExtra(KEY_INTENT_APPROVE,REQUEST_CODE_APPROVE),
    PendingIntent.FLAG_UPDATE_CURRENT
);

Puis joignez l'objet à distance à une action à une action à l'aide de AddremoteInput ()

NotificationCompat.Action action =
    new NotificationCompat.Action.Builder(ic_delete,
        title:"Approve", acceptPendingIntent)
        .addRemoteInput(remoteInput)
        .build();

Enfin, vous devrez appliquer l'action en notification et à l'affichage.

NotificationCompat.builder = notificaitonBuilder = new NotificationCompat.Builder(context:this,channelId:"channel_id")
    .addAction(action)
    // set rest of notification attributes e.g. title, auto cancel, icon etc.

Vous pouvez transmettre les informations requises à partir de l'attribut "Données" de la notification Firebase. Vous devrez utiliser Onreceive () même pour joindre une réponse/des boutons au bas du message.

Ceci est un autre lien utile.

enter image description here

1
Sukhi

Les boutons d'action fonctionnent avec la charge utile de données tandis que le site Web est en cours d'exécution au premier plan. Testé sur Livalhost essayé avec le code ci-dessous travaillant comme prévu.

 navigator.serviceWorker.ready.then(function (registration) { 
                                var notificationTitle = payload.notification.title;
                                var notificationOptions = {
                                    body: payload.notification.body,
                                    data: payload.data,
                                    icon: payload.notification.icon,
                                    image: payload.data.Image,
                                    requireInteraction: payload.notification.requireInteraction,
                                    tag: payload.notification.tag,
                                    click_action: payload.data.click_action,
                                    requireInteraction: true,
                                    actions: [{
                                        action: "Test",
                                        title: "Test",
                                        icon: payload.data.action_button,
                                        height: "100px"
                                    }]
                                };
                                registration.showNotification(notificationTitle, notificationOptions);
                            },50)
                        });

ajoutez le code ci-dessus dans votre JavaScript. app.js

J'ai envoyé une charge utile de mon côté serveur - C # Code.

            {              
                Image = "/image/img1.jpg",
                click_action = "https://secure.mdg.com/",
                action_button = "/image/button.jpg"                
            };

            var notificationModel = new NotificationEntityModel()
            {
                title = "Testing",
                body = "This is fcm Push notification demo",
                Vibrate = new[] { 500, 110, 500, 110, 450, 110, 200, 110, 170, 40, 450, 110, 200, 110, 170, 40, 500 },
                icon = "/image/mdglogo.png",                       
                tag = "Test Notify"                
            };
0
Ushma Mulwani