Quickstart-ios: Support for "mutable-content" on FCM Notifications UI console

[jasonchin]

As detailed in #70 support for "mutable-content" for iOS10+ has been added to the FCM REST API, allowing us to use rich notifications.

Unfortunately, it seems like support has yet to be added to the Firebase Notifications UI console.
Adding a key/value pair of "mutable_content":"true" to the custom data results in the mutable_content flag being set outside of the aps dictionary.

Here is an example of the json data received from the notification:

{
    aps =     {
        alert = test4;
    };
    "gcm.message_id" = "0:1488424277441551%8fafd9188fafd918";
    "gcm.n.e" = 1;
    "google.c.a.c_id" = 7301971312164562540;
    "google.c.a.e" = 1;
    "google.c.a.ts" = 1488424277;
    "google.c.a.udt" = 0;
    mediaType = image;
    mediaUrl = "https://upload.wikimedia.org/wikipedia/commons/thumb/2/2a/FloorGoban.JPG/1024px-FloorGoban.JPG";
    "mutable_content" = true;
}

Is there any chance that this will be added to the Notifications console anytime soon?

[morganchen12]

@kroikie this seems like an oversight on our part. Can you confirm?

[jasonchin]

Sorry, any movement on this?

Project deadlines are approaching and we need to know if we should be creating a separate server to handle the REST API or not.. :)

[kroikie]

@jasonchin This feature is currently only available via the REST API. Messages sent from the Firebase console do not have this feature. Custom data in the Firebase console allows you to send data payload key-value pairs it does not add fields to the notification payload which is where the mutable-content field would have to be set.

I understand that this would be useful in the Firebase console, but we do not have support for it there yet.

[TagCommander]

I have more or less the same question here, either I'm doing something wrong (which result in the payload to be outside of "aps") or it's not working yet. Can you confirm it please?

I created a SO question for it some days ago : using-data-in-rich-push-notification-on-ios-with-fcm

Thanks a lot!

[jvannoord]

Competitors have a simple checkbox in their console UI for whether to add mutable-content : 1 in the notification payload. Please consider doing something to solve this sooner rather than later. Exposing something in the REST API is not helpful to Console users.

[andrewprocter]

@kroikie is there any plans to add this to the Firebase console in the future similar to how @jvannoord suggests?

[manveersinghdodiya]

Hello All,
Please replace mutable-content with mutable_content. At ios end it automatically converted into mutable-content. Enjoy :)

[TofPlay]

I have the same concern as @jasonchin
Any update about this ticket? If we take into account the ticker #70 it has been more than a year since this problem persists.

Exposing something in the REST API is not helpful to Console users.

Fully agree with @jvannoord

[manveersinghdodiya]

hello dafurman what kind of problem you are facing in iOS 11 and iOS 10 ?

[ManiaChamp]

How to put mutable_content under APS json , It comes out side that.

[kroikie]

@Maegereg mutable-content is not supported via the Firebase console, I'm afraid you will have to use the HTTP API to use this. Thanks for the feature request.

[deepmode]

Hi Firebase team,
Any timeframe for supporting mutable-content in the console UI? This is what everyone need for their day to day operation.

[Ankish]

How difficult can it be to set that up! Badge and other things are already in place :( .

[ashislaha]

Just for helping,

If anyone wants to use REST POST API, here it is, use the Postman with below configuration

URL:
https://fcm.googleapis.com/fcm/send

Header:

"Content-Type": "application/json",
"Authorization": "key=<Server_key>"

BODY:

{
    "to": "<Device FCM token>",
    "notification": {
      "title": "Check this Mobile (title)",
      "body": "Rich Notification testing (body)",
      "mutable_content": true,
      "sound": "Tri-tone"
      },

   "data": {
    "url": "<url of media image>",
    "dl": "<deeplink action on tap of notification>"
      }
}

That's it. Thanks!!!

[virkrishna786]

thanks bro its working

[sisoje]

any news on this?

[preetamjadakar]

Boom!! Here is my FCM response as rich notification with an image is working just fine using FCM console.

Pod in-place is: pod 'Firebase/Messaging', '~> 4.3.0

[AnyHashable("google.c.a.e"): 1, AnyHashable("aps"): {
    alert =     {
        body = "Spent the whole day to troubleshoot this image notification!";
        title = "Good night!";
    };
    "mutable-content" = 1;
}, AnyHashable("google.c.a.c_id"): 5583118048490418076, AnyHashable("fcm_options"): {
    image = "https://www.birthdaywishes.expert/wp-content/uploads/2015/10/Good-Night-Time-to-dream.jpg";
}, AnyHashable("google.c.a.udt"): 0, AnyHashable("google.c.a.ts"): 1584465609, AnyHashable("gcm.n.e"): 1, AnyHashable("google.c.sender.id"): 31219337206, AnyHashable("gcm.message_id"): 1584465609897758]

Make sure you extract image url in right way using above response from FCM, within the didReceive method of push notification extension.

[Bang9]

Boom!! Here is my FCM response as rich notification with an image is working just fine using FCM console.

Pod in-place is: pod 'Firebase/Messaging', '~> 4.3.0

[AnyHashable("google.c.a.e"): 1, AnyHashable("aps"): {
    alert =     {
        body = "Spent the whole day to troubleshoot this image notification!";
        title = "Good night!";
    };
    "mutable-content" = 1;
}, AnyHashable("google.c.a.c_id"): 5583118048490418076, AnyHashable("fcm_options"): {
    image = "https://www.birthdaywishes.expert/wp-content/uploads/2015/10/Good-Night-Time-to-dream.jpg";
}, AnyHashable("google.c.a.udt"): 0, AnyHashable("google.c.a.ts"): 1584465609, AnyHashable("gcm.n.e"): 1, AnyHashable("google.c.sender.id"): 31219337206, AnyHashable("gcm.message_id"): 1584465609897758]

Make sure you extract image url in right way using above response from FCM, within the didReceive method of push notification extension.
@preetamjadakar

1. Notification Extension Service is not working on background
2. Notification Extension Service is working on background only when has mutable-content field
3. firebase console is not support mutable-content

I understood above, is it incorrect?

[preetamjadakar]

@Bang9 :

Everything is working fine (background as well as foreground) and I'm able to get "mutable-content" = 1; from the FCM console in all the case by-default.

[kwstasna]

I can also confirm that now Firebase Web Console actually sends the "mutable-content" = 1;
You can find the data from the image that you put in Notification image (optional)
in the following function of UNNotificationServiceExtension

    override func didReceive(_ request: UNNotificationRequest, withContentHandler contentHandler: @escaping (UNNotificationContent) -> Void) {
        self.contentHandler = contentHandler
        bestAttemptContent = (request.content.mutableCopy() as? UNMutableNotificationContent)
        guard let bestAttemptContent = bestAttemptContent else {
            return
        }

        if let imageData = request.content.userInfo["fcm_options"] as? [String: Any],
            let imgURLString = imageData["image"] as? String,
            let imgURL = URL(string: imgURLString) {
            downloadImageFrom(url: imgURL) { (attachment) in
                guard let attachment = attachment else {
                    contentHandler(bestAttemptContent)
                    return
                }
                bestAttemptContent.attachments = [attachment]
                contentHandler(bestAttemptContent)
            }
        } else {
            contentHandler(bestAttemptContent)
        }
    }

And the download url function is the following

    private func downloadImageFrom(url: URL, with completionHandler: @escaping (UNNotificationAttachment?) -> Void) {
        let task = URLSession.shared.downloadTask(with: url) { (downloadedURL, response, error) in
            guard let downloadedURL = downloadedURL else {
                completionHandler(nil)
                return
            }
            var urlPath = URL(fileURLWithPath: NSTemporaryDirectory())
            let uniqueURLEnding = ProcessInfo.processInfo.globallyUniqueString + ".jpg"

            urlPath = urlPath.appendingPathComponent(uniqueURLEnding)

            try? FileManager.default.moveItem(at: downloadedURL, to: urlPath)

            do {
                let attachment = try UNNotificationAttachment(identifier: "picture", url: urlPath, options: nil)
                completionHandler(attachment)
            } catch {
                completionHandler(nil)
            }
        }
        task.resume()
    }

The functions above are extracted from @ashislaha medium post that you can find here

https://medium.com/@mail2ashislaha/rich-push-notification-with-firebase-cloud-messaging-fcm-and-pusher-in-ios-platform-8b4e9922120