|
2 | 2 |
|
3 | 3 | The code for the Push Plugin for NativeScript. |
4 | 4 |
|
5 | | -- [API Reference](#api) |
6 | 5 | - [Getting started](#getting-started) |
| 6 | +- [API Reference](#api) |
7 | 7 | - [Troubleshooting](#troubleshooting) |
8 | 8 |
|
| 9 | + |
| 10 | +## Getting started |
| 11 | + |
| 12 | +- Create a new NativeScript application |
| 13 | + |
| 14 | + tns create MyApp |
| 15 | + |
| 16 | + or use an existing one. |
| 17 | + |
| 18 | +- Add the Push Plugin (from NPM). This will install the push plugin in node_module, in the root of the project. When adding a new platform (or using an existing one) the plugin will be added there as well. |
| 19 | + |
| 20 | + tns plugin add nativescript-push-notifications |
| 21 | + |
| 22 | +### Android |
| 23 | + |
| 24 | +- Go to the application folder and add the Android platform to the application |
| 25 | + |
| 26 | + tns platform add android |
| 27 | + |
| 28 | +- Add google play services, as GCM is part of it. It's present in the android-sdk. Add it like this: |
| 29 | + |
| 30 | + tns library add android C:\Users\your_user_name\AppData\Local\Android\android-sdk\extras\google\google_play_services\libproject\google-play-services_lib\libs |
| 31 | + |
| 32 | + |
| 33 | +- Add sample code in app/main-view-model.js in the function HelloWorldModel() like this one to subscribe and receive messages (Enter your google project id in the options of the register method): |
| 34 | + |
| 35 | +```javascript |
| 36 | + var pushPlugin = require("nativescript-push-notifications"); |
| 37 | + var self = this; |
| 38 | + pushPlugin.register({ senderID: 'your-google-project-id' }, function (data){ |
| 39 | + self.set("message", "" + JSON.stringify(data)); |
| 40 | + }, function() { }); |
| 41 | + |
| 42 | + pushPlugin.onMessageReceived(function callback(data) { |
| 43 | + self.set("message", "" + JSON.stringify(data)); |
| 44 | + }); |
| 45 | +``` |
| 46 | + |
| 47 | +- Attach your phone to the PC, ensure "adb devices" command lists it and run the app on the phone: |
| 48 | + |
| 49 | + tns run android |
| 50 | + |
| 51 | +- The access token is written in the console and in the message area, after subscribing (Look for ObtainTokenThread log record). When sending a notification, the message below the TAP button should be changed with the message received. |
| 52 | + |
| 53 | +### iOS |
| 54 | + |
| 55 | +- Edit the package.json file in the root of application, by changing the bundle identifier to match the one from your Push Certificate. For example: |
| 56 | + "id": "com.telerik.PushNotificationApp" |
| 57 | + |
| 58 | +- Go to the application folder and add the iOS platform to the application |
| 59 | + |
| 60 | + tns platform add ios |
| 61 | + |
| 62 | +- Add sample code in app/main-view-model.js in the function HelloWorldModel() like this one to subscribe and receive messages (Enter your google project id in the options of the register method): |
| 63 | + |
| 64 | +```javascript |
| 65 | + var pushPlugin = require("nativescript-push-notifications"); |
| 66 | + var self = this; |
| 67 | + var iosSettings = { |
| 68 | + badge: true, |
| 69 | + sound: true, |
| 70 | + alert: true, |
| 71 | + interactiveSettings: { |
| 72 | + actions: [{ |
| 73 | + identifier: 'READ_IDENTIFIER', |
| 74 | + title: 'Read', |
| 75 | + activationMode: "foreground", |
| 76 | + destructive: false, |
| 77 | + authenticationRequired: true |
| 78 | + }, { |
| 79 | + identifier: 'CANCEL_IDENTIFIER', |
| 80 | + title: 'Cancel', |
| 81 | + activationMode: "foreground", |
| 82 | + destructive: true, |
| 83 | + authenticationRequired: true |
| 84 | + }], |
| 85 | + categories: [{ |
| 86 | + identifier: 'READ_CATEGORY', |
| 87 | + actionsForDefaultContext: ['READ_IDENTIFIER', 'CANCEL_IDENTIFIER'], |
| 88 | + actionsForMinimalContext: ['READ_IDENTIFIER', 'CANCEL_IDENTIFIER'] |
| 89 | + }] |
| 90 | + }, |
| 91 | + notificationCallbackIOS: function (data) { |
| 92 | + self.set("message", "" + JSON.stringify(data)); |
| 93 | + } |
| 94 | + }; |
| 95 | + |
| 96 | + pushPlugin.register(iosSettings, function (data) { |
| 97 | + self.set("message", "" + JSON.stringify(data)); |
| 98 | + |
| 99 | + // Register the interactive settings |
| 100 | + if(iosSettings.interactiveSettings) { |
| 101 | + pushPlugin.registerUserNotificationSettings(function() { |
| 102 | + alert('Successfully registered for interactive push.'); |
| 103 | + }, function(err) { |
| 104 | + alert('Error registering for interactive push: ' + JSON.stringify(err)); |
| 105 | + }); |
| 106 | + } |
| 107 | + }, function() { }); |
| 108 | +``` |
| 109 | + |
| 110 | +- Run the code |
| 111 | + |
| 112 | + tns run ios |
| 113 | + |
| 114 | +- Send notifications |
| 115 | + |
9 | 116 | ## API |
10 | 117 | ```javascript |
11 | 118 | // Get reference to the push plugin module. |
@@ -165,112 +272,6 @@ The code for the Push Plugin for NativeScript. |
165 | 272 |
|
166 | 273 | ``` |
167 | 274 |
|
168 | | -## Getting started |
169 | | - |
170 | | -- Create a new NativeScript application |
171 | | - |
172 | | - tns create MyApp |
173 | | - |
174 | | - or use an existing one. |
175 | | - |
176 | | -- Add the Push Plugin (from NPM). This will install the push plugin in node_module, in the root of the project. When adding a new platform (or using an existing one) the plugin will be added there as well. |
177 | | - |
178 | | - tns plugin add nativescript-push-notifications |
179 | | - |
180 | | -### Android |
181 | | - |
182 | | -- Go to the application folder and add the Android platform to the application |
183 | | - |
184 | | - tns platform add android |
185 | | - |
186 | | -- Add google play services, as GCM is part of it. It's present in the android-sdk. Add it like this: |
187 | | - |
188 | | - tns library add android C:\Users\your_user_name\AppData\Local\Android\android-sdk\extras\google\google_play_services\libproject\google-play-services_lib\libs |
189 | | - |
190 | | - |
191 | | -- Add sample code in app/main-view-model.js in the function HelloWorldModel() like this one to subscribe and receive messages (Enter your google project id in the options of the register method): |
192 | | - |
193 | | -```javascript |
194 | | - var pushPlugin = require("nativescript-push-notifications"); |
195 | | - var self = this; |
196 | | - pushPlugin.register({ senderID: 'your-google-project-id' }, function (data){ |
197 | | - self.set("message", "" + JSON.stringify(data)); |
198 | | - }, function() { }); |
199 | | - |
200 | | - pushPlugin.onMessageReceived(function callback(data) { |
201 | | - self.set("message", "" + JSON.stringify(data)); |
202 | | - }); |
203 | | -``` |
204 | | - |
205 | | -- Attach your phone to the PC, ensure "adb devices" command lists it and run the app on the phone: |
206 | | - |
207 | | - tns run android |
208 | | - |
209 | | -- The access token is written in the console and in the message area, after subscribing (Look for ObtainTokenThread log record). When sending a notification, the message below the TAP button should be changed with the message received. |
210 | | - |
211 | | -### iOS |
212 | | - |
213 | | -- Edit the package.json file in the root of application, by changing the bundle identifier to match the one from your Push Certificate. For example: |
214 | | - "id": "com.telerik.PushNotificationApp" |
215 | | - |
216 | | -- Go to the application folder and add the iOS platform to the application |
217 | | - |
218 | | - tns platform add ios |
219 | | - |
220 | | -- Add sample code in app/main-view-model.js in the function HelloWorldModel() like this one to subscribe and receive messages (Enter your google project id in the options of the register method): |
221 | | - |
222 | | -```javascript |
223 | | - var pushPlugin = require("nativescript-push-notifications"); |
224 | | - var self = this; |
225 | | - var iosSettings = { |
226 | | - badge: true, |
227 | | - sound: true, |
228 | | - alert: true, |
229 | | - interactiveSettings: { |
230 | | - actions: [{ |
231 | | - identifier: 'READ_IDENTIFIER', |
232 | | - title: 'Read', |
233 | | - activationMode: "foreground", |
234 | | - destructive: false, |
235 | | - authenticationRequired: true |
236 | | - }, { |
237 | | - identifier: 'CANCEL_IDENTIFIER', |
238 | | - title: 'Cancel', |
239 | | - activationMode: "foreground", |
240 | | - destructive: true, |
241 | | - authenticationRequired: true |
242 | | - }], |
243 | | - categories: [{ |
244 | | - identifier: 'READ_CATEGORY', |
245 | | - actionsForDefaultContext: ['READ_IDENTIFIER', 'CANCEL_IDENTIFIER'], |
246 | | - actionsForMinimalContext: ['READ_IDENTIFIER', 'CANCEL_IDENTIFIER'] |
247 | | - }] |
248 | | - }, |
249 | | - notificationCallbackIOS: function (data) { |
250 | | - self.set("message", "" + JSON.stringify(data)); |
251 | | - } |
252 | | - }; |
253 | | - |
254 | | - pushPlugin.register(iosSettings, function (data) { |
255 | | - self.set("message", "" + JSON.stringify(data)); |
256 | | - |
257 | | - // Register the interactive settings |
258 | | - if(iosSettings.interactiveSettings) { |
259 | | - pushPlugin.registerUserNotificationSettings(function() { |
260 | | - alert('Successfully registered for interactive push.'); |
261 | | - }, function(err) { |
262 | | - alert('Error registering for interactive push: ' + JSON.stringify(err)); |
263 | | - }); |
264 | | - } |
265 | | - }, function() { }); |
266 | | -``` |
267 | | - |
268 | | -- Run the code |
269 | | - |
270 | | - tns run ios |
271 | | - |
272 | | -- Send notifications |
273 | | - |
274 | 275 | ## Troubleshooting |
275 | 276 |
|
276 | 277 | In case the application doesn't work as expected. Here are some things you can verify |
@@ -309,4 +310,4 @@ In case the application doesn't work as expected. Here are some things you can v |
309 | 310 |
|
310 | 311 | ### iOS |
311 | 312 |
|
312 | | -- Error "Error registering: no valid 'aps-environment' entitlement string found for application" - this means that the certificates are not correctly set in the xcodeproject. Open the xcodeproject, fix them and you can even run the application from xcode to verify it's setup correctly. The bundle identifier in xcode should be the same as the "id" in the package.json file in the root of the project. |
| 313 | +- Error "Error registering: no valid 'aps-environment' entitlement string found for application" - this means that the certificates are not correctly set in the xcodeproject. Open the xcodeproject, fix them and you can even run the application from xcode to verify it's setup correctly. The bundle identifier in xcode should be the same as the "id" in the package.json file in the root of the project. |
0 commit comments