Ads

Wednesday, July 4, 2012

Appcelerator Cloud Push Notification in iPhone


Push Notification in iOS Using Appcelerator Cloud Service

We can implement Push Notification in iOS using Appcelerator Cloud Service in 5 steps.
  1. Cloud User Login
  2. Retrieve Device Token
  3. Subscribe a Channel
  4. Push Certificates
  5. Push Configuration 

1)Cloud User Login
Create a test user in Appcelerator Cloud Console 
My Apps -> Manage ACS ->  DEVELOPMENT ->  Users
and login with credential. Use below code for cloud user login

Appcelerator Cloud Push Notification in iPhone

 
    var Cloud = require('ti.cloud');

    Cloud.Users.login({
        login: 'push123',
        password: 'push123'
    }, function (e) {
    if (e.success) {
    var user = e.users[0];
     alert("Loggin successfully");
        } else {
            alert("Error :"+e.message);
        }
    });
 
2)Retrieve Device Token
You can Retrieve Device Token using below code
 

    Titanium.Network.registerForPushNotifications({
        types: [
            Titanium.Network.NOTIFICATION_TYPE_BADGE,
            Titanium.Network.NOTIFICATION_TYPE_ALERT,
            Titanium.Network.NOTIFICATION_TYPE_SOUND
        ],
    success:function(e)
    {
        deviceToken = e.deviceToken;
        alert("deviceToken = "+deviceToken);
        registerForPush();
    },
    error:function(e)
    {
        alert("Error: "+e.message);
    },
    callback:function(e)
    {
        alert("push notification received"+JSON.stringify(e.data));
    }
    });


3)Subscribe a Channel
Add following code for channel subscribtion
 
    Cloud.PushNotifications.subscribe({
        channel: 'demo_alert',
        type:'ios',
        device_token: deviceToken
    }, function (e) {
        if (e.success) {
            alert('Success :'+((e.error && e.message) || JSON.stringify(e)));
        } else {
            alert('Error:' + ((e.error && e.message) || JSON.stringify(e)));
        }
    });

4)Push Certificates
It is most important part of this Tutotial, Appcelerator Doc clearly expained about how to create push certificates. http://cloud.appcelerator.com/docs/ios#push
Follow this section("Provisioning your Device for specialized Development") to create Development and Production Push certificates. Your certificates should be in .p12 format.

5)Push Configuration
After getting the push certificates(in my case I have created development push certificate), upload it in cloud console. 
My Apps -> Manage ACS ->  DEVELOPMENT ->  Settings -> Apple iOS Push Certificates

Appcelerator Cloud Push Notification in iPhone


Cool.., You have completed  Push Notification setup. This time for testing, run the application in iOS device and click the button "REGISTER PUSH NOTIFICATION". You will get 3 alerts continuously.

Then go to My Apps -> Manage ACS -> DEVELOPMENT -> Push Notifications, here you can see "1 iOS clients subscribed to push notifications"


 It is time to send push notification, enter the values and hit the button "Send Push Notification" instantly you will receive notification in your iOS device(with default icon and sound)

Appcelerator Cloud Push Notification in iPhone
Push Notification in iPad

Appcelerator Cloud Push Notification in iPhone
Push Notification Callback


Here you can download the complete working project from my Github Appcelerator Titanium iOS Push Notification

If anyone found difficulties in push notification implementation feel free to contact me

CodeStrong


35 comments:

  1. Hello, I just want to thank you for taking the time to make this tutorial. It really helped me a lot. I was having an error getting the DeviceToken. I solved it by updating my provisional profile at the apple developer site and downloading the one with the push notifications allowed.

    Thank you so much and greetings from Mexico :)

    ReplyDelete
    Replies
    1. Hi Manrique,

      Thanks for reading my blog. You are welcome.

      Delete
  2. Thank you for this tutorial, it was very helpful, however I do have a question. I have everything working, registering, logging in, and subscribing. But my problem is getting the status of the app's setting in the Notification Center. At first, the user is prompted to accept or decline notifications and if they accept, they get notifications. But if they change to decline in the Notification Center, I need to get that status so I can unsubscribe in the app - disabling notifications. The same is true if at first they decline and then later accept notification in the Notification Center and then subscribing in the app. Any help will be appreciated.

    ReplyDelete
    Replies
    1. Hi, Thanks for Reading my blog.

      You can do this by checking the "remoteNotificationsEnabled", It will Indicates whether push notifications have been enabled using registerForPushNotifications.

      Refer below link
      http://docs.appcelerator.com/titanium/2.1/index.html#!/api/Titanium.Network-property-remoteNotificationsEnabled

      Best Luck

      Delete
    2. When I used this function, it always returns false. Here is a test I did.

      1) Accept to turn on Notifications which logins and subscribes to a channel. I verify in Notification Center that it is enabled.
      2) I setup a button on the screen that sends an alert (Ti.Network.remoteNofificationsEnabled())
      3) After pressing the button, the alert is false.

      It doesn't matter the settings in the Notifications Center, this function always returns false.

      Any ideas way?

      Thanks for the help!

      Delete
    3. It seems strange, better you can ask this question at
      http://developer.appcelerator.com

      Delete
    4. I was able discover more about the situation. I was able to get remoteNoficationsEnabled to be true when the register for push is successful. However, it seems that this status only reflects if the push registration is done within the app not what the user does in the Notification Center. So far, I can not find a function that will return the status within the Notification Center.

      Perhaps I am making this more complex than necessary. Have you successfully submitted an iOS app using push notifications? If so, how did you handle the user accepting or declining notifications? Did you ask only the first time and not worry about changes in the Notification Center, or did you ask each time the app was started? Does Apple test the push notifications?

      I really do appreciate your time and help with this as I have spent way too much time on something that should be relatively simple.

      Delete
    5. I built few Titanium apps which were published in the App Store and Android Market.However, I am in the process of creating innovative titanium apps integrating push technology, which hasn't hit the App Store. I have a definite mobile strategy to connect Ti apps with Appcelerator Cloud Service, and my post was in that direction.

      FYI : "remoteNoficationsEnabled" is check whether device subscribed for reomote Push Notification, and it is not about "Notification Center" settings changes.

      Delete
    6. Thanks for your help and good luck in your future projects. I think I will submit what I have and see what happens.

      Delete
    7. Thanks Folbrecht, Best Luck :)

      Delete
  3. Hi I was searching a proper way to use ACS from a month and your blog helped me to get it work so many thanks. But if you post a blog about sending push notification programmatically it will be very helpful. Especial I need to know how to send push notification to particular device.

    And I have one more question may I know how much time approximately it takes to send one push to a particular device?

    ReplyDelete
    Replies
    1. Hi Niv, Thanks for reading my blog.

      Go to My Apps -> Manage ACS -> DEVELOPMENT -> Push Notifications, here you can send the push notifications to subscribed devices. I am not sure about whether you can send a push notification to the particular device, but you can send the notification based on channel.

      ACS Push notification will reach the end-user instantly, after you hitting the "Send Push Notification" button.

      Delete
  4. I have been able to receive the push notifications successfully, but I can't update the application badge (which says how many notifications have been received).

    I read it was possible using a background service, however, I have been unsuccessful in doing so. Can you help me out? I need to update the app's badges outside the app.

    My question is here (on appcelerator), it could help a lot of people there:
    http://developer.appcelerator.com/question/140368/update-app-badge-on-notification-received#comment-134626

    Thank you. :)

    ReplyDelete
  5. Sufian, I don't have idea about setting app badge while app in background.

    As I know it should work when you use BackgroundServices(http://developer.appcelerator.com/question/125799/is-there-any-way-to-do-a-local-badge-push-when-app-is-closed#answer-219145), but in your case it is strange.

    ReplyDelete
  6. So, I have to get my app users to signup for an account before they can receive notifications?

    ReplyDelete
  7. I've done as described, the app starts, I hit the button and it cycles through its alerts. It passes each stage and finally subscribes to a channel, that seems to signify to me that everything is working...but it never receives a notification. Have you come across this before at all?

    ReplyDelete
  8. Steve, Make sure below things,
    1)Did you seen this message(1 iOS clients subscribed to push notification) at Appc console?

    2)Push certificates(http://cloud.appcelerator.com/docs/ios#push)

    3)MAKE SURE WHETHER YOU ARE IN DEVELOPMENT MODE OR PRODUCTION MODE, DO THE
    TESTING IN APPC CONSOLE AS PER THE MODE(PRODUCTION/DEVELOPMENT)

    ReplyDelete
  9. I was in the wrong mode!!!! Thanks for that Karthi. Now all I need to find is some example code for sending the things via PHP, can't find that so far.

    ReplyDelete
  10. On our system we identify a user by their email address.
    Let's say a user has 3 devices: 2 iOS devices and an Android device. Should we be creating a new user for them: Cloud.Users.create({}); from each device or just once? If we do push a notification it would be appropriate to push it to all devices. Thanks for your help!

    ReplyDelete
  11. Hi Sam,
    Thanks for reading my blog.
    If you use more than one device for a user, you no need to create new cloud user(
    Cloud.Users.create({}); )

    You just use cloud user login(
    Cloud.Users.login)

    ReplyDelete
  12. Hi, I getting an error : undefined on device, why?


    Thx

    ReplyDelete
  13. I am getting the same error message - it's creating a user ok, then logging in ok but then an error undefined

    ReplyDelete
  14. Hi Karthi,


    I would like to know how can i callback just the message alone in the alertDialog.


    I would like the alertDialog to display the message pushed only instead of the string of JSON data.


    Appreciate your advice.

    ReplyDelete
  15. Hi Kolin,

    Just change your callback function at app.js like below(https://github.com/railskarthi/acs_ios_push/blob/master/Resources/app.js) line 74

    callback:function(e)
    {
    var response = JSON.parse(e.data);
    alert(response.alert);
    }

    ReplyDelete
  16. Hi Karthi,


    Thanks for this amazing work!.


    The Problem is:
    I have implemented a Push notification for iPhone application, and also setting the app badge when the application is in foreground.


    I want the app badge to be set when the application is in background. How can we get the Push Notification details in the background service. any idea. please share.
    Thanks.

    ReplyDelete
  17. Hi Karthi,


    Thanks for this amazing work!.


    The Problem is:
    I have implemented a Push notification for iPhone application, and also setting the app badge when the app is in foreground.



    I want to set the badge value when the app is in background and how to receive the Push Notification callback in background service to set the App Badge when the app is in background. any idea.
    Please share.


    thanks
    Srivathsava

    ReplyDelete
  18. Just wanted to say Thanks!

    One thing that cought me out was that I had to 'Run' the app on my device rather than 'Debug' for it to return anything from the'registerForPushNotifications' (thanks to Joseph Sacha on the Ti Dev Centre for pointing that one out to me).

    ReplyDelete
  19. How to Implement Google Cloud message (GCM) service for Android App usign Titnaum....any usefull link...

    ReplyDelete
  20. if I got it right, just edit the callback with this:

    http://docs.appcelerator.com/titanium/latest/#!/api/Titanium.UI.AlertDialog

    ReplyDelete
  21. Titanium Wire and other products essential to the titanium welding process are available at most service center locations. Titanium weld wire and welding supplies are available for aerospace, medical and industrial applications.

    ReplyDelete
  22. Hi Karthi,

    Thanks for this link, Really this was most helpful to me.

    And i got every thing fine (3 alerts and You currently have 1 iOS client, 0 Android clients subscribed to push notifications.)

    But receiving the below message in appcelerator website when i trying to send push notification.

    "422 Unprocessable Entity - The app is not setup for push notification."

    Note: My first message was sending successfully (But not received that in iOS.)

    Please help to solve this.

    ReplyDelete
  23. Hello Karthi,
    I followed the instructions, created the ios certificate, and made the users in development side. When I register, I get 4 alerts, user created, loggin successfully, devicetoken, and success.

    That part seems to be working fine, but when I send out push notifications, I don't receive them. I'm also sending the push notifications through development side. I specify the channel, 'demo_alert' and specific users as well, but I'm still not receiving them. Is there a solution to this? I've even checked my iPhone settings for the app and it should be receiving the push.

    ReplyDelete
  24. Arley Andrada MariaJune 24, 2014 at 8:10 AM

    I just released a Push Notification module for Android and iOS, with direct connection to APN (Apple) and GCM (Google), without to require ACS, UrbanAirship or any push broker contract or fee; Receive unlimited free push notifications in your apps.

    [buy PushClient at Appcelerator Marketplace](https://marketplace.appcelerator.com/apps/10615)

    ReplyDelete