React-native-firebase: [๐Ÿ“š] Add description about adding extension to iOS App to receive notification with image

Created on 6 Sep 2020  ยท  13Comments  ยท  Source: invertase/react-native-firebase

Documentation Feedback

https://rnfirebase.io/messaging/server-integration#ios

Hello! I'm working on a new App for iOS built with React Native and react-native-firebase!

@react-native-firebase/messaging is awesome to implement notification feature quickly!

But I thought adding "You must create an App-extension to receive notification with image" to its document will be nice for beginners.

I had a few background for iOS App developing, so it won't be a huge problem.
But maybe for people who are not familiar with iOS App developing, it would be a great assist!


Good First Issue Docs

Most helpful comment

@mikehardy
With the help of @davidepalazzo ,
I think we're good to close this issue!

Thank you for your cooperation!

All 13 comments

Hi there! This feature is generally available for anyone I think? #4085

And it has been documented? #4089

https://rnfirebase.io/messaging/server-integration#ios

Is there some other place this could be to make it more obvious?

@mikehardy
Hi! I created an extension using this method.

I know Firebase has a document about creating a notification with image, but we should appeal to developer that we have an easier way to implement it.
(Or am I missing something? I thought @react-native-firebase/messaging doesn't have an out-of-box image support for notification, which need to create extension manually.)

Did you follow the links I sent?

@mikehardy
Yes, I read #4085, #4089 and https://rnfirebase.io/messaging/server-integration#ios .

@davidepalazzo
Does changes from #4085 expected to support image without creating extension?

I'm facing the same problem. Doesn't seem like the extension works out of the box without having to do additional steps, but not sure. @davidepalazzo I'm creating my own extension then trying to inherit the RNFBMessaging one but no luck.

Hi @Pittan. Yes, that was the intent of the PR. Although, it looks like it stopped working.ย I tested it with a fresh install โ€“ the payload comes through fine, the notification is displayed but the image isn't showing. Not too sure what changed since I pushed the code.

Hey @helenaford, I found that to make it work with you need to target FirebaseMessaging in your service extension and add a new target in the main Podfile. So the steps would be to:

  1. From Xcode create a new Notification Service Extension
  2. Add a pod to the target
target 'EXTENSION_NAME' do
  pod 'Firebase/Messaging', '~> VERSION_NUMBER'
end
  1. Import FirebaseMessaging.h in the EXTENSION_NAME.m file

This is a solid solution and should work reliably.

@mikehardy, I'm happy to extend on the above steps and add it to the doc. I'll remove the previous code I added in favour of the native extension as I feel this is a better and more stable approach. Thoughts?

@davidepalazzo I trust your judgement and will happily work with you to ingest the change here, thanks for the offer

No worries @mikehardy, I'm more than happy to work on this change and have a PR within a few days.

In terms of structure, I'd probably move out the instructions from under Server Integration to its own section if that works for you guys. Perhaps something like messaging/notifications-with-image?

That sounds good

Hey @mikehardy, I just pushed 2 PRs:

  • #4225 adds new bits to go in the doco
  • #4226 removes the code that is going to become redundant after the documentation is updated

Cheers.

Please support for ipad! iphone worked but ipad not working.

@vuongductuanktmt try changing the version of the Notification Service Extension to a lower value:
Screen Shot 2020-09-10 at 5 12 10 pm

It should match whatever version you're using in your main app target. iOS 10 is the minimum version required to make this work.

@mikehardy
With the help of @davidepalazzo ,
I think we're good to close this issue!

Thank you for your cooperation!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

alizahid picture alizahid  ยท  3Comments

csumrell picture csumrell  ยท  3Comments

callmejm picture callmejm  ยท  3Comments

joecaraccio picture joecaraccio  ยท  3Comments

rgoldiez picture rgoldiez  ยท  3Comments