Ionic no alert on one signal push notification

Ionic Framework Ionic Angular
1

I’m working on Push Notifications with ionic and OneSignal. Up to now I can receive the Notifications, but if I click on it, nothing happens. For testing it would be nice, if the app would show an alert like “The notification was opened”. My goal is, that the app routes to a specific page or modal, but that isn’t important now.

import { Component } from '@angular/core';

import { Platform,AlertController } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

@Component({
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.scss']
})
export class AppComponent {

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen,private alertCtrl: AlertController) {
    platform.ready().then(() => {
      statusBar.styleDefault();
      splashScreen.hide();
      
      //Remove this method to stop OneSignal Debugging 
      window["plugins"].OneSignal.setLogLevel({logLevel: 6, visualLevel: 0});
            
      // Set your iOS Settings
      var iosSettings = {};
      iosSettings["kOSSettingsKeyAutoPrompt"] = false;
      iosSettings["kOSSettingsKeyInAppLaunchURL"] = false;
      
      window["plugins"].OneSignal
        .startInit("my key is in here")
        .handleNotificationOpened(function(openResult) 
        {
          this.showAlert('Notification opened', 'You already read this before',JSON.stringify(openResult));
          console.log('Notification opened: ' + JSON.stringify(openResult));   
        })
        .iOSSettings(iosSettings)
        .inFocusDisplaying(window["plugins"].OneSignal.OSInFocusDisplayOption.Notification)
        .endInit();
      
      // The promptForPushNotificationsWithUserResponse function will show the iOS push notification prompt. We recommend removing the following code and instead using an In-App Message to prompt for notification permission (See step 6)
      window["plugins"].OneSignal.promptForPushNotificationsWithUserResponse(function(accepted) {
        console.log("User accepted notifications: " + accepted);
      });
    });
  }

  async showAlert(title, msg, task) {
    const alert = await this.alertCtrl.create({
      header: title,
      subHeader: msg,
      buttons: [
        {
          text: `Action: ${task}`,
          handler: () => {
            // E.g: Navigate to a specific screen
          }
        }
      ]
    })
    alert.present();
  }
}

Can somebody help me? Why can’t I see any alert? Thanks

2

You seem to be using Ionic Native shims for the splash screen and status bar; is there a specific reason you’re not doing likewise for OneSignal?

3

No, there’s no specific reason. I was following this tutorial from one signal documentation.
So if there are any mistakes, feel free to tell me.

4

I would suggest switching to the Ionic Native shim as well if for no other reason than code clarity.

Never type the word “function” inside the body of one. this inside your handleNotificationOpened handler isn’t what you expect it to be.

1 Like