如何使用react-native-firebase在iOS中将自定义图像添加到通知中

时间:2019-06-14 15:13:19

标签: firebase react-native react-native-firebase

我想在Firebase云消息传递中使用数据有效载荷在通知中显示图像。该图像被指定为托管该图像的网站的网址。

这似乎是我要添加的图像作为附件,请参见下面的第8行。但是,除了应用程序图标之外,没有其他图像。

const notification = new firebase.notifications.Notification()
        .setNotificationId("notification_id")
        .setTitle(notification.data.title)
        .setBody(notification.data.body)
        .setData({ url: notification.data.url })
        .ios.setLaunchImage(notification.data.icon)
        .android.setBigPicture(notification.data.icon)
        .ios.addAttachment("some_id", notification.data.icon, {});

问题是没有任何错误消息可以帮助我。该通知将显示标题和正文,如预期的那样,但是没有图像。从我能阅读的文档中,我想做的事是可能的。

1 个答案:

答案 0 :(得分:0)

简短的答案是,iOS上的react-native不支持“丰富的推送通知”,即带有图像的通知。

更长的答案是,如果您添加一些快速代码,则将图像的支持添加到本机项目中相当简单。

解决:

打开您的xcode项目,然后转到“编辑器”->“添加目标...”。选择名为“ Notification Service Extension”的“ Application Extension”。

您可以随意命名,但如果使用CocoaPods,请确保选择了正确的项目。

创建后,将override func didReceive(_ request: UNNotificationRequest, withContentHandler contentHandler: @escaping (UNNotificationContent) -> Void)的内容替换为:

      self.contentHandler = contentHandler
      bestAttemptContent = (request.content.mutableCopy() as? UNMutableNotificationContent)

      // get the variables that is needed later.
      guard let bestAttemptContent = bestAttemptContent,
        let attachmentURLAsString = bestAttemptContent.userInfo["icon"] as? String, 
      // "icon" is the key for the image url in the notification. It 
      // could be named whatever you want.
        let attachmentURL = URL(string: attachmentURLAsString) else {
          return
      }

      // call a custom function to download the image before attaching
      // it to the notification and presenting it.
      downloadImageFrom(url: attachmentURL) { (attachment) in
        if let attachment = attachment {
          bestAttemptContent.attachments = [attachment]
          contentHandler(bestAttemptContent)
        }

      }

然后需要创建downloadImageFrom函数:

  private func downloadImageFrom(url: URL, with completionHandler: @escaping (UNNotificationAttachment?) -> Void) {
    let task = URLSession.shared.downloadTask(with: url) { (downloadedUrl, response, error) in

      //verify that a url exists.
      guard let downloadedUrl = downloadedUrl else {
        completionHandler(nil)
        return
      }

      // create a local unique filepath.
      var urlPath = URL(fileURLWithPath: NSTemporaryDirectory())
      let uniqueURLEnding = ProcessInfo.processInfo.globallyUniqueString + ".png"
      urlPath = urlPath.appendingPathComponent(uniqueURLEnding)

      // fetch the image from the url
      try? FileManager.default.moveItem(at: downloadedUrl, to: urlPath)

      // if successful, return the image as an attachment.
      do {
        let attachment = try UNNotificationAttachment(identifier: "picture", url: urlPath, options: nil)
        completionHandler(attachment)
      } catch {
        completionHandler(nil)
      }
    }
    task.resume()
  }

构建应用程序时,它将使用此代码代替加载通知。

发送通知时,您必须记住要包含“ icon”值。发送通知所需的示例:

    "notification": {
        "body": "body",
        "title": "title"
        "mutable_content": true // this row is required for the notification to work!
    },
    "data": {
        "icon":"https://pusher.com/static_logos/320x320.png", // change to your image url.
    },