Skip to content
This repository was archived by the owner on Feb 7, 2019. It is now read-only.

Commit f49deb4

Browse files
authored
Merge pull request #245 from NativeScript/tbozhikov/migration-doc
Tbozhikov/migration doc
2 parents 08f2ab2 + 4db2219 commit f49deb4

File tree

1 file changed

+94
-0
lines changed

1 file changed

+94
-0
lines changed

MIGRATE-TO-FIREBASE.md

Lines changed: 94 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,94 @@
1+
# Migration guide push-plugin -> Firebase plugin
2+
If you have an app that uses push-plugin for push notifications and need to switch to nativescript-plugin-firebase, this guide can help you. If you are just starting with push notifications, however, it would be best to use [Firebase plugin]("https://github.com/EddyVerbruggen/nativescript-plugin-firebase") and refer [its documentation on messaging]("https://github.com/EddyVerbruggen/nativescript-plugin-firebase/blob/master/docs/MESSAGING.md").
3+
#### 1. Add the plugin to your app
4+
Go to your app's root folder in terminal app and execute
5+
```bash
6+
tns plugin add nativescript-plugin-firebase
7+
```
8+
> Upon plugin installation, you'll be prompted to choose which features to use. Choose "yes" for Firebase Messaging (of course :)). By default, the plugin saves the configuration as a file (firebase.nativescript.json) to use it when reinstalling the plugin.
9+
10+
#### 2. Setup
11+
Add `GoogleService-Info.plist` (for iOS) or `google-services.json` (for Android) in App_Resources/iOS (and App_Resources/Android, respectively). These are the configuration files that come from your Firebase apps. If you don't have such yet, go to https://console.firebase.google.com and create one. See [Firebase plugin's docs]("https://github.com/EddyVerbruggen/nativescript-plugin-firebase/blob/master/docs/MESSAGING.md") for more info on initial setup.
12+
13+
#### 3. Initialization prerequisite
14+
Make sure you [`require` the plugin in `app.ts` / `main.ts` / `main.aot.ts`](https://github.com/EddyVerbruggen/nativescript-plugin-firebase/blob/55cfb4f69cf8939f9101712fed22383196b08d36/demo/app/app.ts#L5)
15+
*before* `application.start()`, and do `init()` *after* the app has started (not in `app.ts` - not even in a timeout; move it out of `app.ts` entirely!). This ensures the notifications will be receivable in the background.
16+
17+
EXAMPLE:
18+
```js
19+
// in app.ts
20+
// ...
21+
const firebase = require("nativescript-plugin-firebase");
22+
// ...
23+
app.start({ moduleName: 'main-page' });
24+
```
25+
26+
#### 4. Add some code [to handle a notification]("https://github.com/EddyVerbruggen/nativescript-plugin-firebase/blob/master/docs/MESSAGING.md#handling-a-notification")
27+
28+
EXAMPLE: The following code using push-plugin:
29+
```js
30+
private pushSettings = {
31+
notificationCallbackIOS: (message: any) => {
32+
this.updateMessage("Message received!\n" + JSON.stringify(message));
33+
}
34+
};
35+
36+
pushPlugin.register(this.pushSettings, (token: String) => {
37+
console.log("Device registered. Access token: " + token);
38+
39+
pushPlugin.registerUserNotificationSettings(() => {
40+
console.log("Successfully registered for push.");
41+
}, (err) => {
42+
console.log(("Error registering for interactive push: " + JSON.stringify(err));
43+
});
44+
}, (errorMessage: String) => {
45+
console.log((JSON.stringify(errorMessage));
46+
});
47+
```
48+
... could be rewriten using Firebase plugin like:
49+
```js
50+
import * as firebase from "nativescript-plugin-firebase";
51+
52+
firebase.init({
53+
onMessageReceivedCallback: (message: firebase.Message) => {
54+
console.log(`Message: ${message}`);
55+
},
56+
onPushTokenReceivedCallback: function(token) {
57+
console.log("Firebase push token: " + token);
58+
}
59+
});
60+
```
61+
#### 5. Testing with messages
62+
To test with real messages, you can use the UI in Firebase Console, or use the `https://fcm.googleapis.com/fcm/send` API. See the [testing docs section in Firebase plugin]("https://github.com/EddyVerbruggen/nativescript-plugin-firebase/blob/master/docs/MESSAGING.md#testing").
63+
64+
#### 6. Interactive Push Notifications - in push plugin they are set in the options argument passed to pushPlugin.register(options, callback) method. In Firebase plugin, it is done in a very similar way:
65+
66+
```js
67+
import * as firebase from "nativescript-plugin-firebase";
68+
import { messaging } from "nativescript-plugin-firebase/messaging";
69+
...
70+
const model = new messaging.PushNotificationModel();
71+
model.iosSettings = new messaging.IosPushSettings();
72+
model.iosSettings.interactiveSettings = new messaging.IosInteractivePushSettings();
73+
model.iosSettings.interactiveSettings.actions = [<<array of IosInteractiveNotificationAction>>]
74+
75+
model.iosSettings.interactiveSettings.categories = [{ identifier: "SOME CATEGORY" }];
76+
77+
model.onNotificationActionTakenCallback = () => {
78+
// callback to hook to if you want to handle what action have been taken by the user
79+
};
80+
81+
firebase.registerForInteractivePush(model: messaging.PushNotificationModel);
82+
```
83+
84+
Some lines in the above example have been omitted. See [Firebase plugin's interactive notifications docs]("https://github.com/EddyVerbruggen/nativescript-plugin-firebase/blob/master/docs/MESSAGING.md#interactive-notifications-ios-only-for-now") for more details.
85+
86+
#### 7. areNotificationsEnabled() API
87+
In Firebase plugin it is pretty similar to the one in push-plugin, and even simpler to use:
88+
89+
```js
90+
import * as firebase from "nativescript-plugin-firebase";
91+
92+
const areTheyEnabled = firebase.areNotificationsEnabled(); // synchronous, retruns boolean;
93+
```
94+
This API is also supported in Android, SDK version 24 and above

0 commit comments

Comments
 (0)