Firebase Cloud Messaging Push Notification

[Francis]

Is there going to be support or a plugin for the new FCM(firebase cloud messaging) or can we still use the https://github.com/Telerik-Verified-Plugins/PushNotification plugin for this?

Thanks,

Francis

 

[Anton Dobrev]

Hello Francis,

According to this article https://developers.google.com/cloud-messaging/faq GCM will continue to be supported. You can still use the plugin (even it is GCM-only) for your apps.

Let us know should you have further questions or considerations.

Regards,
Anton Dobrev
Telerik by Progress

 

 

[Riyaz]

hi there,

thanks for sharing that article. But now for new projects that we are creating in google's console it takes us to firebase for enabling cloud messaging. In that case, GCM is no longer available for creating new projects but API keys. So how do we integrate firebase in out new telerik projects? since there are no plugins available as of now?

 

Regards

Riyaz / Ritesh

[Anton Dobrev]

@Riyaz

You can use the Sender Id (in your client app) and Server Key (in the backend settings) as configured in Firebase as explained here.

Let me know should you have further questions.

Regards,
Anton Dobrev
Telerik by Progress

 

 

[Riyaz]

Hi there Anton,

Thanks a lot for your help. I am now able to generate and store my FCM Token in my database. However, when i send any message to the said token (either using firebase console notification send option / any other method) i am don't receive any notification on my device. Please advice.

 

 

Regards

Riyaz

[Marco]

Having same issue, I am getting this error "MismatchSenderId", I checked the senderId(previously Project Number) and Server key, they are fine, any suggestion?

 

[Riyaz]

Hi Marco,

I am not getting errors but success as below

{"multicast_id":5388125578359783017,"success":1,"failure":0,"canonical_ids":0,"results":[{"message_id":"0:1478956595493046%46aa824af9fd7ecd"}]}

 

however i don't see any notifications in the device.

You must use exact api key pertaining to the sender id ...however they have depreciated server key and instead now they are providing with FCM Token to be used in place of api key. If you are using PHP for sending the notifications then i have the code. It shows success but the notification is never received. 

 

Thanks

[Marco]

Thanks Riyaz,

Can you send me the code? 

[Riyaz]

@Marco

Sure marco...here we go...

 

<?php
// API access key from Google API's Console
define( 'API_ACCESS_KEY', 'YOUR_API_ACCESS_KEY' );
$registrationIds = array( $_GET['id'] ); //your fcm token
// prep the bundle
$msg = array
(
'body' => $_GET['body'], //message body
'title' => $_GET['title'], //message title
'vibrate' => 1,
'sound' => 1,
);
$fields = array
(
'registration_ids' => $registrationIds,
'notification' => $msg
);
 
$headers = array
(
'Authorization: key=' . API_ACCESS_KEY,
'Content-Type: application/json'
);
 
$ch = curl_init();
curl_setopt( $ch,CURLOPT_URL, 'https://fcm.googleapis.com/fcm/send' );
curl_setopt( $ch,CURLOPT_POST, true );
curl_setopt( $ch,CURLOPT_HTTPHEADER, $headers );
curl_setopt( $ch,CURLOPT_RETURNTRANSFER, true );
curl_setopt( $ch,CURLOPT_SSL_VERIFYPEER, false );
curl_setopt( $ch,CURLOPT_POSTFIELDS, json_encode( $fields ) );
$result = curl_exec($ch );
curl_close( $ch );
echo $result;
?>

 

 

You can use the following url to fire the code

YOUR_CODES_FILE_NAME.php?id=YOUR_FCM_TOKEN_WHERE_YOU_WANT_TO_SEND_MESSAGE_&title=Hey!&body=How%20are%20you?

[Riyaz]

@Anton

Sir, I am desperately waiting for your reply. Please help us all. Haven't heard from you since my post.

 

Regards

[Anton Dobrev]

@Riyaz

It appears that the payload is sent correctly, however, my assumption is that you may want to use the data property instead of the notification because the plugin reads the objects in the data object to display a notification.

For example:

{
    "collapse_key":"Updates Available",
    "data":{
        "title":"Push Title",
        "message":"Push message for Android",
        "customData":"Custom data for Android"
    },
    "delay_while_idle":false,
    "time_to_live":1000,
    "retries":1
}

Let me know if this works for you.

Regards,
Anton Dobrev
Telerik by Progress

 

 

[Riyaz]

@Anton,

No sir...it didn't work. Have been trying n trying since your help. You see things were too simple until GCM.

Below is the code that i am following which was working fine until GCM. I would be really grateful if you have can a look and help me out.

 var pushNotification;
         
            function onDeviceReady() {
                document.addEventListener("backbutton", onBackKeyDown, true);
try
{
                pushNotification = window.plugins.pushNotification;

                if (device.platform == 'android' || device.platform == 'Android' ||
                            device.platform == 'amazon-fireos' ) {
pushNotification.register(successHandler, errorHandler, {"senderID":"MY_SENDER_ID","ecb":"onNotification"}); // required!
} else {
                    pushNotification.register(tokenHandler, errorHandler, {"badge":"true","sound":"true","alert":"true","ecb":"onNotificationAPN"}); // required!
                }
                }
catch(err)
{
txt="There was an error on this page.\n\n";
txt+="Error description: " + err.message + "\n\n";
alert(txt);
}
                
                nameFloat(device.uuid);
                
            }
            // handle APNS notifications for iOS
            function onNotificationAPN(e) {
                if (e.alert) {
                     //$("#app-status-ul").append('<li>push-notification: ' + e.alert + '</li>');
                     // showing an alert also requires the org.apache.cordova.dialogs plugin
                     navigator.notification.alert(e.alert);
                }
                if (e.sound) {
                    // playing a sound also requires the org.apache.cordova.media plugin
                    var snd = new Media(e.sound);
                    snd.play();
                }
                if (e.badge) {
                    pushNotification.setApplicationIconBadgeNumber(successHandler, e.badge);
                }
            }

            function onNotification(e) {
                //$("#app-status-ul").append('<li>EVENT -> RECEIVED:' + e.event + '</li>');
                switch( e.event )
                {
                    case 'registered':
if ( e.regid.length > 0 )
{
                        var regId = e.regid;
                        var unid = device.uuid;
                        jQuery.ajax({
                        type: "POST",
                        data: {unid:unid, regId:regId},
                        url: "http://MY_URL_WHERE_I_STORED",
                        dataType:'json',
                        success:function(response)
                        {
                      $("#app-status-ul").html(response);
                        }
                        });
                        

// Your GCM push server needs to know the regID before it can push to this device
// here is where you might want to send it the regID for later use.
console.log("regID = " + e.regid);
}
                    break;
                    case 'message':
                    // if this flag is set, this notification happened while we were in the foreground.
                    // you might want to play a sound to get the user's attention, throw up a dialog, etc.
                    if (e.foreground)
                    {
$("#app-status-ul").append('<li>--INLINE NOTIFICATION--' + '</li>');
       // on Android soundname is outside the payload.
               // On Amazon FireOS all custom attributes are contained within payload
               var soundfile = "ring.mp3";
               // if the notification contains a soundname, play it.
               // playing a sound also requires the org.apache.cordova.media plugin
               var my_media = new Media(soundfile);
my_media.play();
}
else
{ // otherwise we were launched because the user touched a notification in the notification tray.
if (e.coldstart)
$("#app-status-ul").append('<li>--COLDSTART NOTIFICATION--' + '</li>');
else
$("#app-status-ul").append('<li>--BACKGROUND NOTIFICATION--' + '</li>');

                            
}
$("#app-status-ul").append('<li>MESSAGE -> MSG: ' + e.payload.message + '</li>');
                        //android only
//$("#app-status-ul").append('<li>MESSAGE -> MSGCNT: ' + e + '</li>');
                        //amazon-fireos only
                        //$("#app-status-ul").append('<li>MESSAGE -> TIMESTAMP: ' + e + '</li>');
                    break;
                    case 'error':
$("#app-status-ul").append('<li>ERROR -> MSG:' + e + '</li>');
                    break;
                    default:
$("#app-status-ul").append('<li>EVENT -> Unknown, an event was received and we do not know what it is</li>');
                    break;
                }
            }
            function tokenHandler (result) {
                //$("#app-status-ul").append('<li>token: '+ result +'</li>');
                // Your iOS push server needs to know the token before it can push to this device
                // here is where you might want to send it the token for later use.
            }
            function successHandler (result) {
                //$("#app-status-ul").append('<li>success:'+ result +'</li>');
            }
            function errorHandler (error) {
                //$("#app-status-ul").append('<li>error:'+ error +'</li>');
            }

[Anton Dobrev]

@Riyaz ,

I cannot test your code right now, but given that you can obtain a push token it should be working as expected. Can you check what is the payload you are sending to the device, the plugin only looks for the data property and the title and message fields?

Also, is the app in foreground or background when you are sending the notification?

Regards,
Anton Dobrev
Telerik by Progress

 

 

[Nagaraj]

I am trying to use "cordova-plugin-firebase-master" from this link "https://github.com/arnesson/cordova-plugin-firebase" as custom plugin, But i am unable to configure the plugin,has anyone have tried it, any reference would help me better. 

[Anton Dobrev]

@Nagaraj

As far as I can see the plugin in question is utilizing hooks which unfortunately is not supported for custom plugins imported in your AppBuilder project.

You may examine the Verified plugin available here and if it fits your scenario. Here is how you can install in in your project.

Let me know if this helps and if you have questions.

Regards,
Anton Dobrev
Telerik by Progress