@anynines/fcm

Anynines Capacitor FCM

@anynines/fcm

Capacitor community plugin for enabling FCM capabilities

The Fork

This is a fork of the original @capacitor-community/fcm plugin for Ionic Capacitor, which can be found here. Kudos to the original contibutors.

The fork was created since the changes in the Firebase classes and APIs broke our push implementations @anynines.

Previously you retrieved the Firebase registration token for both iOS and Android by calling

FirebaseInstances.getInstance().getToken()...

which returns a 163-character string. Since the update, on Android that will now return a Firebase Instance Installation token in JWT format. That might still work fine depending on your architecture, but can be a major problem with custom push systems built to target individual devices and users.

So to get your actual registration token you now have to call

FirebaseMessaging.getInstance().getToken()...

...and then override the OnCompleteListener as described in the Firebase docs (we more or less threw that in and added the JS callback).

If you are facing a similar problem, please feel free to try our solution.

Maintainers - fork

Maintainer	GitHub	Web
anynines GmbH	@anynines	https://anynines.com

Maintainers - original

Maintainer	GitHub	Social
Stewan Silva	stewones	@stewones
Daniel Pereira	danielprrazevedo	@DandanPrr

Installation

Using npm:

npm install @anynines/fcm

Using yarn:

yarn add @anynines/fcm

Sync native files:

npx cap sync

Notice

This plugin is intended to be used combined with Capacitor API for Push Notifications. Capacitor only provides APN token whereas this plugin offers the possibility to work with FCM tokens and more.

API

method	info	platform
`subscribeTo`	subscribe to fcm topic	ios/android
`unsubscribeFrom`	unsubscribe from fcm topic	ios/android
`getToken`	get fcm token to eventually use from a server	ios/android
`deleteInstance`	remove local fcm instance completely	ios/android
`setAutoInit`	enable the auto initialization of the library	ios/android
`isAutoInitEnabled`	check whether auto initialization is enabled	ios/android

Usage

import { FCM } from "@anynines/fcm";
import { PushNotifications } from "@capacitor/push-notifications";

// external required step
// register for push
await PushNotifications.requestPermissions();
await PushNotifications.register();

// now you can subscribe to a specific topic
FCM.subscribeTo({ topic: "test" })
  .then((r) => alert(`subscribed to topic`))
  .catch((err) => console.log(err));

// Unsubscribe from a specific topic
FCM.unsubscribeFrom({ topic: "test" })
  .then(() => alert(`unsubscribed from topic`))
  .catch((err) => console.log(err));

// Get FCM token instead the APN one returned by Capacitor
FCM.getToken()
  .then((r) => alert(`Token ${r.token}`))
  .catch((err) => console.log(err));

// Remove FCM instance
FCM.deleteInstance()
  .then(() => alert(`Token deleted`))
  .catch((err) => console.log(err));

// Enable the auto initialization of the library
FCM.setAutoInit({ enabled: true }).then(() => alert(`Auto init enabled`));

// Check the auto initialization status
FCM.isAutoInitEnabled().then((r) => {
  console.log("Auto init is " + (r.enabled ? "enabled" : "disabled"));
});

Add Google config files

Navigate to the project settings page for your app on Firebase.

iOS

Download the GoogleService-Info.plist file. In Xcode right-click on the yellow folder named "App" and select the Add files to "App".

Tip: if you drag and drop your file to this location, Xcode may not be able to find it.

Android

Download the google-services.json file and copy it to android/app/ directory of your capacitor project.

Certificate

apple
- create an app identifier (apple site)
  - add push notifications
  - add signing request (https://help.apple.com/developer-account/#/devbfa00fef7)
  - generate an APN key and then note down the ID displayed. also download the p8 file (https://fluffy.es/p8-push-notification/)
firebase
- add the downloaded p8 file to firebase settings with noted key ID and the account team ID

iOS setup

sudo gem install cocoapods (once a time)
ionic start my-cap-app --capacitor
cd my-cap-app
mkdir www && touch www/index.html
npx cap add ios
npm install --save @anynines/fcm
npx cap sync ios (always do sync after a plugin install)
npx cap open ios

sign your app at xcode (general tab)
enable remote notification capabilities
add GoogleService-Info.plist to the app folder in xcode

// (optional) turn off `swizzling` in the `info.plist`
<key>FirebaseAppDelegateProxyEnabled</key>
<string>NO</string>

Tip: every time you change a native code you may need to clean up the cache (Product > Clean build folder) and then run the app again.

Prevent auto initialization

If you need to implement opt-in behavior, you can disable the auto initialization of the library by following the Firebase docs.

Android setup

ionic start my-cap-app --capacitor
cd my-cap-app
mkdir www && touch www/index.html
npx cap add android
npm install --save @anynines/fcm
npx cap sync android (always do sync after a plugin install)
npx cap open android
add google-services.json to your android/app folder
[extra step] in android case we need to tell Capacitor to initialise the plugin:

Now you should be set to go. Try to run your client using ionic cap run android --livereload.

Tip: every time you change a native code you may need to clean up the cache (Build > Clean Project | Build > Rebuild Project) and then run the app again.

Prevent auto initialization

If you need to implement opt-in behavior, you can disable the auto initialization of the library by following the Firebase docs.

Example

https://github.com/capacitor-community/fcm/tree/master/example

License

MIT

Contributors ✨

Thanks goes to these wonderful people (emoji key):

_Stew 💻 📖	_{Daniel Pereira} 💻 📖	_{Priyank Patel} 💻	_Nikolas 🚧	_{Ben Schattinger} 💻
_{James Manners} 💻	_{Borja Rodríguez} 🚧	_Karrlllis 📖	_jamesmah 💻	_{Josh Sharpe} 🚧
_{Mantas Šimkūnas} 💻 📖	_{Olivier Overstraete} 🚧	_{Hemang Kumar} 💻 🚧	_{Luca Ban} 📖	_{Alex Griffith} 💻 🚧
_bdirito 🚧