Giter VIP home page Giter VIP logo

cordova-plugin-firebase-messaging's Introduction

Cordova plugin for Firebase Cloud Messaging

NPM version NPM downloads Twitter

Donate Your help is appreciated. Create a PR, submit a bug or just grab me ๐Ÿบ

Index

Supported platforms

  • iOS
  • Android

Installation

$ cordova plugin add cordova-plugin-firebase-messaging

If you get an error about CocoaPods being unable to find compatible versions, run

$ pod repo update

Plugin depends on cordova-support-google-services for setting up google services properly. Please read the README carefully in order to avoid common issues with a project configuration.

Use variables FIREBASE_CORE_VERSION, FIREBASE_MESSAGING_VERSION and ANDROIDX_CORE_VERSION to override dependency versions on Android.

Methods

In general (for both platforms) you can only rely on custom data fields from a FCM payload.

For iOS APNS payload is stored in aps object. It's available when a message arrives in both foreground and background.

For Android GCM payload is stored in gcm. It's available ONLY when a message arrives in foreground. For a some reason Google applied this limitation into their APIs. Anyway I've created an issue for a future improvement.

onMessage(callback)

Called when a push message received while app is in foreground.

cordova.plugins.firebase.messaging.onMessage(function(payload) {
    console.log("New foreground FCM message: ", payload);
});

onBackgroundMessage(callback)

Called when a push message received while app is in background.

cordova.plugins.firebase.messaging.onBackgroundMessage(function(payload) {
    console.log("New background FCM message: ", payload);
});

requestPermission(options)

Grant permission to recieve push notifications (will trigger prompt on iOS).

cordova.plugins.firebase.messaging.requestPermission().then(function() {
    console.log("Push messaging is allowed");
});

In options object you can specify a boolean setting forceShow. When true this setting forces notification to display even when app is in foreground:

cordova.plugins.firebase.messaging.requestPermission({forceShow: true}).then(function() {
    console.log("You'll get foreground notifications when a push message arrives");
});

getToken(type)

Returns a promise that fulfills with the current FCM token.

cordova.plugins.firebase.messaging.getToken().then(function(token) {
    console.log("Got device token: ", token);
});

This method also accepts optional argument type. Currently iOS implementation supports values "apns-buffer" and "apns-string" that defines presentation of resolved APNS token:

cordova.plugins.firebase.messaging.getToken("apns-string").then(function(token) {
    console.log("APNS hex device token: ", token);
});

revokeToken

Delete the Instance ID (Token) and the data associated with it. Call getToken to generate a new one.

cordova.plugins.firebase.messaging.revokeToken().then(function() {
    console.log("Token revoked successfully");
});

onTokenRefresh(callback)

Triggers every time when FCM token updated. You should usually call getToken to get an updated token and send it to server.

cordova.plugins.firebase.messaging.onTokenRefresh(function() {
    console.log("Device token updated");
});

Use this callback to get initial token and to refresh stored value in future.

subscribe(topic)

Subscribe to a topic in background.

cordova.plugins.firebase.messaging.subscribe("New Topic");

unsubscribe(topic)

Unsubscribe from a topic in background.

cordova.plugins.firebase.messaging.unsubscribe("New Topic");

getBadge

Reads current badge number (if supported).

cordova.plugins.firebase.messaging.getBadge().then(function(value) {
    console.log("Badge value: ", value);
});

setBadge(value)

Sets current badge number (if supported).

cordova.plugins.firebase.messaging.setBadge(value);

Android tips

Set custom default notification channel

If incoming FCM messages do not specify an Android notification channel, you can indicate to FCM what channel should be used as the default by adding a metadata element to your application manifest. In the metadata element specify the ID of the channel that should be used by default by FCM.

<config-file parent="/manifest/application" target="app/src/main/AndroidManifest.xml">
    <meta-data
        android:name="com.google.firebase.messaging.default_notification_channel_id"
        android:value="default_channel_id"/>
</config-file>

Note: You are still required to create a notification channel in code with an ID that matches the one defined in the manifest. See the Android docs for more.

Set custom default notification icon

Setting a custom default icon allows you to specify what icon is used for notification messages if no icon is set in the notification payload. Also use the custom default icon to set the icon used by notification messages sent from the Firebase console. If no custom default icon is set and no icon is set in the notification payload, the application icon (rendered in white) is used.

<config-file parent="/manifest/application" target="app/src/main/AndroidManifest.xml">
    <meta-data
        android:name="com.google.firebase.messaging.default_notification_icon"
        android:resource="@drawable/my_custom_icon_id"/>
</config-file>

Set custom default notification color

You can also define what color is used with your notification. Different android versions use this settings in different ways: Android < N use this as background color for the icon. Android >= N use this to color the icon and the app name.

<config-file parent="/manifest/application" target="app/src/main/AndroidManifest.xml">
    <meta-data
        android:name="com.google.firebase.messaging.default_notification_color"
        android:resource="@drawable/my_custom_color"/>
</config-file>

cordova-plugin-firebase-messaging's People

Contributors

chemerisuk avatar reallysmallsoftware avatar rtk avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.