Push notifications


Peter Bradstreet
Hi David,

Well, I have had a productive week as I now have all of the google mapping stuff working and I also hit a home run with instant messaging and have it working using a firebase realtime database back-end. Thanks for all of your help in getting this far!

One of my final hurdles is to get push notifications working. I have started by trying to get the PushPlugin sample working (AB1) so that I can figure it all out. As soon as the app runs on my phone I get the error about registering. I can see that this is coming from the RegisterPush function. I also see in your example description:

I can see the extra XML code as mentioned but the custom plugin text box in Cordova -> General is empty. Should there be something defined in this box? What do I need to do to get this sample working so that I can start to create my own solution?

Cheers, Pete

decsoft

Hello Peter,

Take a look at the App options -> Cordova -> Batch -> After. As you can see we use that to require the "add phonegap-plugin-push" plugin to be installed. About the registration fail, it's a mistake: look at the "SendRegisterID" app function and change the URL of the used HTTP Client control to HTTPS. We can't use HTTP in Android 9+ except if we add some especific option to allow it. If you change the URL to HTTPS you can see the app successfully register.



Peter Bradstreet
Hi, Thanks for that but still no luck. I am thinking that this AB1 sample is based on Google cloud service rather than Firebase Cloud Messaging which is now defunct? The AB2 sample (PushNotif) seems to work and looks like it is working with the FCM which replaced GCM? Pete

decsoft

Hello Peter,

Humm... in fact AB1 and AB2 uses the same Cordova plugin... and I compile the AB1 sample here and works as expected. Yesterday I receive some push notifications... and think that come from you testing the sample app. :-)

You must refer to the Cordova plugin documentation in order to see if the plugin's configuration did not allow what you wanted or if allow what you wanted... but it's rare that the AB2 sample works for you and the AB1 don't, because, we are talking about the same internally...



Peter Bradstreet
Okay thanks, I will take another look.
Pete

decsoft

Hello Peter,

We use push notifications in various apps, and, works like a charm. We use a Firebase Cloud Messaging account from Google for both Android and iOS platforms. So yes, take a look again, because the app must work as expected in AB1 and AB2 (the app which I am talking about is developed in AB1 right now).



Peter Bradstreet
Hi David,

I must be doing something centrally wrong. I have opened up a fresh and clean instance of PushPlugin.ab and make the single change in it to set the HttpSetUrl to https instead of http. I then compile the app and go into the compiled folder and click on cordova_android_run.bat but I am getting the following error:

I am assuming that the error that is breaking it is referring to minSdkVersion but I am not sure where that is set? Any ideas?

Pete

decsoft

Hello Peter,

Yes; since you refer before that you can try the app, I asume that you already see the "min SDK problem" and then can compile the APK. Certainly, you must change the "min SDK" to API 19. You can do it in the app options -> Cordova -> Android -> Genera -> Minimum SDK.



Peter Bradstreet
Sorry, I was not paying attention and didn't realize that I had the min sdk way too low. I have fixed it and it is working now. Now that I have a working example I should be able to take it from here. Thanks! Pete

decsoft

No problem, Peter. Just post here if you have any question: as I told you we are using push notifications and works very well, so, probably I can help you, or, at least I will try it.



Amin Mousavi
Having the sample running you may find this document helpful

https://firebase.google.com/docs/cloud-messaging/http-server-ref
android and ios accept two different notification payload format. In my case I really wanted to send the icon that android accepts but ios does not, so I read user device platform and send notifications with different formats like below.


Amin Mousavi
Having the sample running you may find this document helpful

https://firebase.google.com/docs/cloud-messaging/http-server-ref
android and ios accept two different notification payload format. In my case I really wanted to send the icon that android accepts but ios does not, so I read user device platform and send notifications with different formats like below.


decsoft

Hello to all,

Thanks, Amin, for share such information here. You are right, of course, Android and iOS can have different notifications' payloads.



Andrea

Hello friends,

i have a problem with push notification,

in the example of Amin Mousavi i ADD a path to the $icon variable

The result is: icon is EMPTY.

it looks like i need to add metadata,

(I would also like the native app icon)

but where? I tried insert into METATAGS OPTIONS.

what are the correct steps? I tried to read more documents, without success

Happy Christmas to All


decsoft

Hello to all,

I think the meta tag is not required at all, at least, I don't use it here in the apps that I develop, who receives push notifications. If you problem is only the icon, I think you must provide an absolute URL for that icon, or, maybe an app's local image path for that icon: that also works.

Below you can see the PHP code (a bit commented) that we use in various apps to send push notifications. The intention of the code is that you can get the whole idea and some useful notes, Paolo: the code is not to be used "as is", but I hope you can get the whole idea. Maybe can be good to copy the below code and paste it in your favorite PHP IDE, so you get the advantage of the syntax highlighting.

If you have any further questions, don't hesitate to post it here in this thread, or just open a new thread without problems. Merry Christmas and Happy New Year to you and for everybody! :-)



decsoft

Hello to all,

After publish my previous post I find something in the code that can confuse you, Paolo. I will try to explain it here. As you can see, in the Android payload of the push notification, we use a couple of keys "icon" and "image". Well, the "image" key is the path of an app's file, and, appear in the push notification (but I can't tell you exactly in what place).

But the "icon" key is different... we see in the code that we use the "pushicon" string. So where is this "pushicon"? Ok. This push icon is also an app's image file, but, must be established using the app's Cordova Extra XML option, exactly like you see below:

Above you can see two things: the first one is something that may you no need, but, that can be useful: it's an instructions to Apache Cordova to copy our app's "google-services.json" (used for push notifications) in the right app's path, so we no need to do manually.

The below instructions is what is related with the icon. What we do is to copy an image file which is added by the app into the right folder to be used when the app is compiled with Apache Cordova. This all is documented in the push notification plugin here.

So for the "icon" key of the payload for Android we are indicating the name of an image file: and this image file is an image file that we add in the app using the app's files manager. Then we use the Cordova Extra XML configuration option to copy this file into the right place, following the push plugin documentation. For that reason the "icon" file is not a path (like I suggest in my previous post), but the name (without extension) of a PNG file, which must be found in the "res/drawable" directory of the app.

I hope you can get it working, Paolo, however, remember that you can post here or in a new thread if you have any further questions.



Andrea

Hello David, Thank you very much for the reply, i am looking carefully at your code,

I also tried to put the absolute path of the image online, but it always gives me the empty icon.

"https: //mysite/images/icon.png" (I also tried with an .ico file)

(I also created the image 72x72px)


decsoft

Hello Paolo,

Yes; it's my mistake! After publish my post I find the mistake and then publish this other post trying to explain the "icon" key. Please, read it and don't hesitate to post here if you have any further questions!



decsoft

Hello Paolo,

Please, upgrade your copy of DecSoft App Builder: I publish a new release enhancing the "CordovaPushNotifications" sample app in order to use a "icon" key in the Android payload. Basically take a look at the app's Files manager: you can see an icon included under the "Images" tab. Then take a look also at the app's Cordova Extra XML configuration option, and, finally, look at the server's PHP script "sendpush.php", in which we "define" the "icon" to be used.



Andrea

I was hoping and I was convinced that I have solved but not yet, now as per your procedure inside "\ android \ res \ drawable" I have the "pushicon" file and on the php code ''icon '=>' pushicon '" but still can't see each other! what's missing? thank you very much for your availability !! Answer when you have time, think about Christmas! :) smack!


decsoft

Hello Paolo,

I was hoping and I was convinced that I have solved but not yet, now as per your procedure inside "\ android \ res \ drawable" I have the "pushicon" file and on the php code '' icon '=>' pushicon '"but still can't see each other! what's missing? thank you very much for your availability !! Answer when you have time, think about Christmas! :) smack!

I think we are crossing our messages. :-) Please, take a look at my very last post.



Amin Mousavi

Hi Paolo,

Most of the work for notifications takes place at server side. You have to install the plugin on the client to generate the notification ID and post it on to the server. When you have the ID stored, you could use that to send notifications to the client. I used Firebase for this purpose and so the API key you see in the code below is coming from Firebase.

I have Improved the PHP files David has created for the server side to handle the payload formats needed for Android and ios users I leave the improved version below in case you find it of use.


decsoft

Hello to all,

Yes; you are right, Amin: the most part is done in the server side. The app has something to say, of course, for example, when receive the push notification. The payload can tell us where to redirect the user, to one view or to another, or finally, what to do with a particular notification. In the particular case of the "icon" both client (the app) and server side is required: the app stores the icon and provide the right XML stuff in the Cordova Extra XML option to copy the icon in the expected place. Then the server refers to that icon in the push notification payload.

But you are right, the push notifications are mostly handled in the server side, and can be more or less complex, depending on our needs. In our app cases, for example, we store in the app's server database the push IDs, but also the users platform (that we take from the app using the Cordova Device plugin). Additinally we also saves the notifications itself in the database, becuase our apps offers a kind of "history of notifications", so we can show it to the users. Almost all of these stuff is optional, anyway, and, again, depend on the app that we are developing.

Thanks for sharing your code with us, Amin!



decsoft

Hello to all,

Yesterday, as I post above, I prepare a new release of AB enhacing the "CordovaPushNotifications" sample app in order to use a personalized icon for the push notifications. I did not try the sample, because, I use exactly the same Cordova Extra XML configuration that I am using here in some of my own apps. This morning I will to try the sample app, and, to my surprise, the icon in the push notifications is not the expected one... but the default one: the app's icon itself.

Apparently my mistake was that I am using the same push icon than the app icon in my own apps, so, I can't see the problem until I try to use a completely different icon for the push notifications. Today I review the push plugin documentation and found that maybe the problem is that we must indicate more than one location for the push icon to be used. I am not sure about this, however, the point is that I can't see the icon working, so, I prepare a new Cordova Extra XML configuration option like below:

Doing that, now yes, the "icon => pushicon" reference is working as expected. So I modify the "CordovaPushNotifications" sample app, in order to use the above configuration, and, prepare the payload (server side scripts samples) to use not only the "icon" key, but also the "image" key, just to see if that works as expected, and certainly it's working now as expected: both the prepared push icon and the image is what we can see in the push notification message.

I did not publish a new release of AB, but, I update the installers right now, so, please, download the current release (if you download it yesterday, you can't see a new release using the product's updater tool), in order to get ready with these modifications into the "CordovaPushNotifications" sample app. Now you can see how the "pushicon" works as expected, in addition to the "image" (also customized) that we use for the push notifications.



Andrea

Wordeful,thanks, I'll try later!

PS: to make you understand that my level is not very low (with PHP) have already managed to manage notifications on the database, and create a form to send individual users. The next step is to study a little How it works the topic, expander notification, And above all interact with actions.

I want to clarify that each of your in-depth posts is really useful for me because I study it with a lot of attention, Before asking anything I try to do as many tests as possible.Really Thanks for everything


decsoft

Hello to all,

PS: to make you understand that my level is not very low (with PHP) have already managed to manage notifications on the database, and create a form to send individual users. The next step is to study a little How it works the topic, expander notification, And above all interact with actions.

Sounds very good!

I want to clarify that each of your in-depth posts is really useful for me because I study it with a lot of attention, Before asking anything I try to do as many tests as possible.Really Thanks for everything

No problem, Paolo! Always thank you for your trust!



Andrea
David, I would have liked to write to you, everything ok, solved, but unfortunately I have to tell you that it still hasn't been solved, it remains a mystery. I did as suggested, without missing any steps. The icon remains empty. To give you more details, the info put on the extra xml work and in the path "\ compiled \ platforms \ android \ app \ src \ main \ res \ drawable-mdpi" (etc), pushicon.png file is present. And in the php file the code is correct " 'icon' => 'pushicon'," To understand, I would also be content to see the default app icon, not necessarily a custom one

decsoft

Hello Paolo,

Humm... it's quite rare... I try the sample app right now and works as expected, then maybe something is missing in your own implementation... I suggest you to try the sample app, because you must see that app working as expected, like I do. After you see the sample app working as expected, we can recognize that something is missing in your own implementation.

Maybe the push notification payload? Take a look also at the server's scripts of the sample app, Paolo, since I modify the push notification payload too.



Andrea
I tried to compile your example (using your server)
photo-2020-12-26-11-28-37
The only change I make as mentioned in the past is to replace the plugin url in "Apache Cordova batch" in "CALL cordova plugin add @ havesource / cordova-plugin-push" otherwise I get this error

This is the log

My device is One Plus Nord

decsoft

Hello Paolo,

About the error while using the push plugin ID... apparently it's an internet connection problem? I can't be sure right now... the only I can say is that I use the plugin ID as you can see in the sample app and works (is installed) as expected...

About the push notification's icon, note that the image is shown correctly... but the icon fails... what I think is that you are not including the icon in your app? But you say above that the icon is copied in the expected folders...

Certainly the icon is missing (because it's blue, and in your image it's appear gray...)... but, if the icon is included in the app as an image file, I can't imagine why it's not used as expected... just like I can see it here...

Maybe the problem with the plugin ID is causing the icon problem? You have any kind of firewall running in your PC? Maybe what we must try in the first place is to install the plugin using his plugin ID... because if I can do it here... you must also do it!

Maybe you can perform a search around the error that you get when try to use the plugin ID... maybe you can found the problem that disallow to use the plugin ID at the first place: maybe update / reinstall NodeJS and GIT can help? :-/

P.S. Note the error in the console: "There is an internet connection problem or the plugin ID is no correct"... since the plugin ID is correct... because it's what I am using here... maybe the problem is certainly something related with the internet connection?



decsoft

Hello Paolo,

Please, try to upgrade / reinstall NodeJS. Additionally, try with other Android device (if possible) to see if the icon is shown properly. Why? Because the image that you post above shown an icon... which is not the app's icon... so apparently the custom icon is trying to be used? Maybe it's the Android version of your device has something to say too... what version of Android are you using?



decsoft

Hello Paolo,

Just for your information... I try with the "@havesource/cordova-plugin-push" plugin ID (which you are using, if I am not wrong) and the sample app also works as expected here. So we can discard that the problem is realted with the the "original" plugin ID... the plugin ID which you are using is also working here as expected.

What version of Android you have installed in your device? Can you try with another device if possible?



Andrea

By updating nodejs and Git, I no longer had the problem with the repository, if anyone has the same problem, they just have to update!

As for the icon problem, my mistake was to put an image (logo) as an icon, not respecting the parameters of the icon, by eye I think that more colors cannot be used!

Thanks publicly to David, who thanks to his availability made sure that we found the solution together!

My problem is SOLVED!


decsoft

Hello Paolo,

Glad to know that you got it! :-)


Everybody can read the DecSoft support forum for learning purposes, however only DecSoft customers can post new threads. Purchase one or more licenses of some DecSoft products in order to give this and other benefits.

This website uses some useful cookies to store your preferences.

I agree. Hide this note. Give me more information.