Search code examples
androidcordovaionic-frameworkpush-notificationphonegap-plugins

Open a specific view in ionic app when user taps on push notification


I know this question has been asked and answered many times but none of the solution is working for me.

I have followed ionic.io documentation https://docs.ionic.io/services/push/ to implement push notification and it works fine when app is in foreground. I am also able to receive notification when app is closed. Now when user clicks on that notification, I want to open a specific view.

As per documentation, To handle push notifications in your app, we need to listen to the cloud:push:notification event using angular’s $on.

$scope.$on('cloud:push:notification', function(event, data) {
  var msg = data.message;
  alert(msg.title + ': ' + msg.text);
});

This code is working fine when app is foreground. But when app is closed and user opens the app by tapping the push notification, I want to open specific view/controller. I have placed the above code in .run function and outside $ionicPlatform.ready function. Here is my code to call FCM Rest service

function sendFCMNotification($request_data){
        $ch = curl_init("https://fcm.googleapis.com/fcm/send");

        //The device token.
                $token = $request_data['device_id'];

        //Title of the Notification.
                $title = $request_data['title'];

        //Body of the Notification.
        $body = $request_data['body'];

        //Creating the notification array.
        $notification = array('title' =>$title , 'body' => $body,'content-available'=> '1');

        //This array contains, the token and the notification. The 'to' attribute stores the token.
        $arrayToSend = array('to' => $token, 'notification' => $notification);

        //Generating JSON encoded string form the above array.
        $json = json_encode($arrayToSend);

        //Setup headers:
        $headers = array();
        $headers[] = 'Content-Type: application/json';
        $headers[] = 'Authorization: key= {MY GCM KEY}';

        //Setup curl, add headers and post parameters.
        curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "POST");
        curl_setopt($ch, CURLOPT_POSTFIELDS, $json);
        curl_setopt($ch, CURLOPT_HTTPHEADER,$headers);

        //Send the request
        curl_exec($ch);

        //Close request
        curl_close($ch);
    }

Can anyone help me in achieving this?

Pushwoosh provides a method which can tell us if the app has been launched by clicking push notification or not. https://rawgit.com/Pushwoosh/pushwoosh-phonegap-3.0-plugin/master/Documentation/files/PushNotification-js.html#PushNotification.getLaunchNotification

Is there any similar function in ionic push plugin?


Solution

  • If you are sending a CURL req to ionic for push use this data structure

    $notficationHolder =array(
            "user_ids" => array(),
            "profile" => "push",
            "notification"=>array(
                "android"=>array(
                    "title"=>'TITLE',
                    "message"=>"You have a notification",
                    "sound" => "sound",
                    "icon_color" => "#FA2B2E",
                    "icon" => "notification",   
                    /* "image" => "https://pbs.twimg.com/profile_images/617058765167329280/9BkeDJlV.png", */
                    "payload" => array(
                        '$state'=> 'main.myProfile',
                        '$stateParams'=> array()
                    ) 
                ),
    
                "ios"=>array(
                    "sound" => "default",
                    "payload" => array(
                        '$state'=> 'main.myProfile',
                        '$stateParams'=> array()
                    )
                )
            )
        );
    

    This is an array. json encode it and curl it to ionic. The catch is your payload property in the notification object. you need to add in payload attribute

     {"$state":'yourStateName','$stateParams':{'paramOne':1,'paramTwo':2}}