Ionic - native push plugin hangs

Ionic Framework ionic-v3
1

Hi,

I’m trying to get basic application working with push notifications on IOS. I have created really simple and basic application using the following code

10143  ionic start aaa tabs
10145  cd aaa
10146  pod setup
10147  cordova plugin add cordova-plugin-crosswalk-webview
10148  ionic cordova plugin add phonegap-plugin-push --variable SENDER_ID=XXXXXXXXX
10149  npm install --save @ionic-native/push
10150  ionic Cordova platform add ios
10151  cordova platform add ios
10152  code .
10153  ionic cordova build ios --prod --verbose

Build runs without any problems and I’m able to open workspace in Xcode - enable push notifications and build and run application.

However as soon as I’m going to do that application hangs and not much happens in the log debug output that I could tell from

2017-06-15 15:26:17.501088+0200 MyApp[2573:1048327] Apache Cordova native platform version 4.3.1 is starting.
2017-06-15 15:26:17.501626+0200 MyApp[2573:1048327] Multi-tasking -> Device: YES, App: YES
2017-06-15 15:26:17.618780+0200 MyApp[2573:1048327] Using UIWebView
2017-06-15 15:26:17.619991+0200 MyApp[2573:1048327] [CDVTimer][handleopenurl] 0.061989ms
2017-06-15 15:26:17.621536+0200 MyApp[2573:1048327] [CDVTimer][intentandnavigationfilter] 1.497984ms
2017-06-15 15:26:17.621612+0200 MyApp[2573:1048327] [CDVTimer][gesturehandler] 0.043988ms
2017-06-15 15:26:17.622350+0200 MyApp[2573:1048327] [CDVTimer][keyboard] 0.672996ms
2017-06-15 15:26:17.661863+0200 MyApp[2573:1048327] [CDVTimer][statusbar] 39.430022ms
2017-06-15 15:26:17.680143+0200 MyApp[2573:1048327] [CDVTimer][splashscreen] 18.200040ms
2017-06-15 15:26:17.680194+0200 MyApp[2573:1048327] [CDVTimer][TotalPluginStartup] 60.283005ms
2017-06-15 15:26:17.686247+0200 MyApp[2573:1048327] createNotificationChecker
2017-06-15 15:26:17.686288+0200 MyApp[2573:1048327] not coldstart
2017-06-15 15:26:17.687556+0200 MyApp[2573:1048327] active
2017-06-15 15:26:17.687718+0200 MyApp[2573:1048327] PushPlugin skip clear badge
2017-06-15 15:26:17.734426+0200 MyApp[2573:1048362] libMobileGestalt MobileGestaltSupport.m:153: pid 2573 (MyApp) does not have sandbox access for frZQaeyWLUvLjeuEK43hmg and IS NOT appropriately entitled
2017-06-15 15:26:17.734485+0200 MyApp[2573:1048362] libMobileGestalt MobileGestalt.c:550: no access to InverseDeviceID (see <rdar://problem/11744455>)
2017-06-15 15:26:19.607743+0200 MyApp[2573:1048327] Resetting plugins due to page load.
2017-06-15 15:26:19.840462+0200 MyApp[2573:1048327] Finished load of: file:///var/containers/Bundle/Application/823CCE79-12A1-4E35-94E0-CAEC3F7B4DDB/MyApp.app/www/index.html
2017-06-15 15:26:19.868450+0200 MyApp[2573:1048327] Ionic Native: deviceready event fired after 73 ms

Info on ionic

global packages:

    @ionic/cli-utils : 1.4.0
    Cordova CLI      : 6.5.0
    Ionic CLI        : 3.4.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.4.0
    @ionic/cli-plugin-ionic-angular : 1.3.1
    Cordova Platforms               : ios 4.3.1
    Ionic Framework                 : ionic-angular 3.3.0

System:

    Node       : v6.9.5
    OS         : macOS Sierra
    Xcode      : Xcode 8.3.3 Build version 8E3004b
    ios-deploy : 1.9.1
    ios-sim    : 5.0.13
    npm        : 4.1.2

My code in app components is following

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { HomePage } from '../pages/home/home';

import { Push, PushObject, PushOptions } from '@ionic-native/push';

@Component({
  templateUrl: 'app.html'
})

export class MyApp {
  rootPage:any = HomePage;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen,private push: Push) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.

      // Push Start
      // to initialize push notifications
      const options: PushOptions = {
         android: {
             senderID: '-----'
         },
         ios: {
             alert: 'true',
             badge: true,
             sound: 'false'
         },
         windows: {}
      };

      const pushObject: PushObject = this.push.init(options);

      pushObject.on('notification').subscribe((notification: any) => console.log('Received a notification', notification));

      pushObject.on('registration').subscribe((registration: any) => console.log('Device registered', registration));

      pushObject.on('error').subscribe(error => console.error('Error with Push plugin', error));
      // Push end


      statusBar.styleDefault();
      splashScreen.hide();
    });
  }
}

Is anyone able to point me out what I’m doing here wrong or what I have could be missing ?

2

Hi,

Where are you getting your sender ID from? Are you using Google Firebase for messaging? My response is based on my assumption that you are. If not, sorry …

Ensure that you’ve set up your Firebase app correctly in the Firebase console and uploaded your APNS key (better than separate dev and prod certificates as it covers both development and production), as well as enabling push notifications in your app’s ‘Capabilities’ in Xcode (or in the Plist entry).

If all that is in place I think it may be that you are missing an entry for ‘gcmSandbox’ in your IOS setup. That really threw me when I set this all up. I use something like this:

			ios: {
				senderID: 'xxxxxxxxx',
				alert: 'true',
				badge: true,
				sound: 'true',
				topics: ['mytopic'],
				gcmSandbox: false
			}

I found the ‘gcmSandbox’ setting confusing (although it probably makes perfect sense to seasoned Apple devs ;-)), but it boils down to it needing to be ‘true’ when your are developing your app and building it using Xcode directly on your device (push notifications cannot work on the IOS emulator!), and ‘false’ when you create an ad-hoc or production distribution archive.

Furthermore, read the plugin docs carefully re. the format of push notification payload for IOS:

3
  1. Did you https://ionicframework.com/docs/native/#Add_Plugins_to_Your_App_Module?
  2. Try without cordova-plugin-crosswalk-webview.
4

I have no sender_id - from what I have found around for IOS this can be left as dummy value ?
I will look throughout the docs to see if I have not missed anything.

5

Tried simple app without ant plugins - removing this one have not helped a bit :confused:

6

So you are getting the same problem with a blank app without any plugins?

7

I will test the blank app - might be that I have not properly added it to app module. I will double check that one and report back

8

So for all future people looking why it would not work - I have not added the plugin to app module

import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
import { MyApp } from './app.component';

import { AboutPage } from '../pages/about/about';
import { ContactPage } from '../pages/contact/contact';
import { HomePage } from '../pages/home/home';
import { TabsPage } from '../pages/tabs/tabs';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { Push } from '@ionic-native/push';

@NgModule({
  declarations: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    AboutPage,
    ContactPage,
    HomePage,
    TabsPage
  ],
  providers: [
    StatusBar,
    Push,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]
})
export class AppModule {}

Once that was done - plugin started to load - so I’m one step closed

9

So this :wink:

But great that you fixed it.