Implementing Remote Notification With Rich Media In IOS App

Posted By : Prince Verma | 03-Jun-2018

ios

Requirements:

1. Third Party server Access or for testing use, download APNs by Apple for trigger the notification.

2. iOS 10 or above because lower versions of iOS don’t support Rich Notifications.

3. iOS Device.

Let’s get Started:-

Create a notification service extension.

Click on the File -> New -> Target

Click on Notification Service Extension

Click Next, Enter any Extension name -> Click next -> Activate

Now, A swift file is automatically created in your project with your extension name.

Goto that file.

In didReceive:(with Content Handler:) delegate Method, In this method, you will receive a payload dictionary on receiving notification.

Grab the attachment, download it and add it to notification content.

Insert the below code snippet.

       if let notificationData = request.content.userInfo["data"] as? [String: String] {

             if let urlString = notificationData["attachment-url"], let fileUrl = URL(string: urlString) {


                    URLSession.shared.downloadTask(with: fileUrl) { (location, response, error) in


                      if let location = location {


                           let tmpDirectory = NSTemporaryDirectory()


                            let tmpFile = "file://".appending(tmpDirectory).appending(fileUrl.lastPathComponent)



                            let tempUrl = URL(string: tmpFile)!



                            try! FileManager.default.moveItem(at: location, to: tempUrl) 



                            if let mediaAttachment = try? UNNotificationAttachment(identifier: "", url: tmpUrl) {

                             self.bestAttemptContent?.attachments = [mediaAttachment]

                           }

                        }

                        self.contentHandler!(self.bestAttemptContent!)

                        }.resume()

                }

           }

we are downloading an attachment and append it to the temporary dictionary, for this, we have to move to this temp file to our local storage.

To receive the Rich notification on the device, you will need to add a key/value pair to your payload Dictionary.

“mutable-content” : 1

Sample payload for Rich Notification: -

                   "aps": {

                       "alert": {

                            "body": “body”,

                            "title": "title"

                          },

                         "mutable-content": 1      

                          category: "rich-notifications”

                     },

                    "media-url": “add media url for download attachment“

                  }

In the above code, we are downloading an attachment and append it to the temporary dictionary, for this, we have to move to this temp file to our local storage.

NOTE:- To receive the Rich notification on the device, you will need to add a key/value pair to your payload Dictionary

That's all additional code we required to show media in Push Notification.