Blog

Appcelerator and Urban Airship

By Steven Osborn • May 26th, 2010 • Posted in Partnerships, Push • 15 Comments

Appcelerator is a popular method of quickly building iPhone applications using HTML and javascript. We’ve worked with the Appcelerator folks to bring you some basic steps for how to integrate Urban Airship into your application.

The first thing to do is make a call to registerForPushNotifications which will asynchronously return the result of the registration to one of the callback functions you provide.

var APP_KEY = '';
var APP_SECRET = '';
 
Titanium.Network.registerForPushNotifications({
    types:[
        Titanium.Network.NOTIFICATION_TYPE_BADGE,
        Titanium.Network.NOTIFICATION_TYPE_ALERT,
        Titanium.Network.NOTIFICATION_TYPE_SOUND
    ],
    success: successCallback,
    error: errorCallback,
    callback: messageCallback
});

Next, you just need to create a couple of functions for handling the result of the registration.

The most important thing here is the success callback. This is where you register the device token you just received from Apple with Urban Airship’s servers.

function successCallback(e) {
    var request = Titanium.Network.createHTTPClient({
        onload:function(e) {
            if (request.status != 200 && request.status != 201) {
                request.onerror(e);
                return;
            }
        },
        onerror:function(e) {
            Ti.API.info("Register with Urban Airship Push Service failed. Error: "
                + e.error);
        }
    });
 
    // Register device token with UA
    request.open('PUT', 'https://go.urbanairship.com/api/device_tokens/'
        + e.deviceToken, true);
    request.setRequestHeader('Authorization','Basic '  +
        Titanium.Utils.base64encode(APP_KEY + ':' + APP_SECRET));
    request.send();
}

Then you just need to add in a simple callback to handle rare cases when Apple might reject your application requests for push notifications. The most common cause of errors at this step is an issue with your provisioning profile – check our FAQ for more information.

function errorCallback(e) {
    Ti.API.info("Error during registration: " + e.error);
}

Finally, to display push notifications that are received when your application is already opened, you need one more method. If your application is not running, iPhone OS handles the creation of the notification dialog.

function messageCallback(e) {
     var message;
     if(e['aps'] != undefined) {
          if(e['aps']['alert'] != undefined){
               if(e['aps']['alert']['body'] != undefined){
                    message = e['aps']['alert']['body'];
               } else {
                    message = e['aps']['alert'];
               }
          } else {
               message = 'No Alert content';
          }
     } else {
          message = 'No APS content';
     }
     alert(message);
}

Now, you’re good to go. Your application has registered that device with Urban Airship. All you have to do to send a push notification to that device is send an HTTP POST request to Urban Airship’s REST API.

Once you have this working, it’s trivial to take advantage of other Urban Airship push features such as tags, aliases, broadcast, and auto-badge.

We’re looking forward to seeing what kind of great things people build using Appcelerator with Urban Airship – be sure to drop us a line when your app goes live!

Update: Fixed a typo in the authorization string.

Update 2: Added a more verbose alert parsing to function messageCallback(e). Previous contents were simply displaying the raw JSON, which is useful for debugging but not desirable for a user:

alert(JSON.stringify(e.data));

15 Responses

  1. Push Notifications with Titanium and Urban Airship « Appcelerator Developer Center at 3:49 pm on May 26, 2010

    [...] our good buddies over at Urban Airship published a quick how-to on integrating Apple’s Push Notifications service into your Titanium applicatio….  Really cool stuff – using Titanium’s client side support for push notifications with [...]

  2. Bill at 4:38 pm on May 26, 2010

    This is awesome. Does your in-app service work with Titanium too?

    • karlok at 12:55 pm on May 27, 2010

      +1 for this question – I would love to use Urban Airship with Titanium for in-app purchases!

    • Fred Spencer at 4:14 pm on May 27, 2010

      Same question here. :-)

  3. Alex at 8:28 pm on May 26, 2010

    Okay, I have this code in my app.js, at the top of the file so it fires first, and I can’t seem to get the device to register. Or at least it doesn’t show up in the UA Device Token list.

    Any ideas??

    • Alex at 8:30 pm on May 26, 2010

      UPDATE

      I know get this error…

      Error Domain=ASIHTTPRequestErrorDo main Code=3 UserInfo=0x3554f0 “Authentication Needed”

      Any ideas? I’m using this code verbatim (with some alerts in there so I can see errors on the device)

    • Steven at 9:47 pm on May 26, 2010

      You set your APP_KEY and APP_SECRET ?

    • Adam Lowry at 10:43 pm on May 26, 2010

      For those playing at home, there was a typo in the authorization string. Thanks, Alex, for helping us catch that!

  4. Altaf Sayani at 3:46 am on May 29, 2010

    I got this error while trying it

    Error Domain=NSCocoaErrorDomainCode=3000 UserInfo=0×364550 “no valid ‘aps-environment’ entitlement string found for application”

    any idea?? how to solve it??

    • Altaf Sayani at 4:21 am on May 29, 2010

      My bad, the issue resolved after refreshing the provisioning profile.

      It’s working perfectly fine now.

  5. Nik at 2:40 pm on May 29, 2010

    Is in-app purchases now supported in Titanium as well?

  6. Dominik Hahn at 5:54 am on June 23, 2010

    Are those ‘&&’ falsely generated by the script that adds the code highlighting or did you put them there for purpose?

    • Dominik Hahn at 5:55 am on June 23, 2010

      Sorry, I meant those two & amp; (minus the space). :-)

    • Adam Lowry at 11:46 am on June 23, 2010

      That was a typo, sorry. I’ve updated the text to fix the “&&”.