Building Multi-Platform Mobile Apps with Push Notifications
Upcoming SlideShare
Loading in...5
×
 

Building Multi-Platform Mobile Apps with Push Notifications

on

  • 768 views

The best mobile applications don’t live in a vacuum. They are augmented by dedicated servers, the Internet and Cloud services. While it’s one thing to reach out to server-side services from a ...

The best mobile applications don’t live in a vacuum. They are augmented by dedicated servers, the Internet and Cloud services. While it’s one thing to reach out to server-side services from a mobile application, it’s a completely different affair when the tables are turned and the server needs to reach the phone. Enter push notifications. From iOS to Android, Windows Phone and Windows 8, discover how to send push notifications from cloud-hosted services to a mobile app running on a tablet or phone, and learn how to handle those alerts in your mobile app. We’ll discuss the various push notification services from Microsoft, Apple and Google, how to leverage them in your mobile applications, how to deal with push scenarios for any given multi-platform app, and we’ll also look at platform-specific notifications, like scheduled alerts on iOS and Live Tiles on Windows Phone and Windows 8. The live demos will include a variety of iOS and Windows Phone apps, and also include technical details about Android and Windows 8.

Contact me if you would like me to present this session at your event.

Statistics

Views

Total Views
768
Views on SlideShare
644
Embed Views
124

Actions

Likes
3
Downloads
24
Comments
0

3 Embeds 124

http://www.scoop.it 121
https://twitter.com 2
http://webcache.googleusercontent.com 1

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Building Multi-Platform Mobile Apps with Push Notifications Building Multi-Platform Mobile Apps with Push Notifications Presentation Transcript

  • Building Multi-Platform Mobile Apps with Push Notifications By Nick Landry, MVP App Artisan Nokia Developer Champion & Ambassador activenick@mobility42.com @ActiveNick – www.mobility42.com
  • Who is ActiveNick? • • • • • • • • App Artisan – Mobile Development Consultant – Mobility42 Microsoft MVP: Windows Phone Development – Mobile Publisher – Big Bald Apps: http://www.bigbaldapps.com Nokia Developer Champion and Ambassador Speaker. Blogger. Author. Tweeter. Gamer 20+ Years of Professional Experience Specialties: – Mobile Development – Location Intelligence & Geospatial Systems – Data Visualization, HPC, Cloud – Mobile Game Development Blog: www.ActiveNick.net Twitter: @ActiveNick
  • Agenda • • • • • Device Communication Models Push Notification Services & Notification Types by Platform – Microsoft: Windows Phone & Windows 8 – Apple: iOS – Google: Android Hosting Push Service Providers in the Cloud Demos Q&A
  • Device-Cloud Communication
  • Communication: Device-Initiated • • • • Traditional Client/Server Model (aka “Pull”) Initiated by the user Options: – HTTP-based, request/response – Framework choices (WCF, OData, WebRequest, etc.) – Wire format choices (SOAP, JSON, POX, etc.) – Can also use local/scheduled notifications at app level Drawbacks – Resource-intensive: CPU, networks, battery – Cannot alert the user, not timely – App must be running, in foreground or background
  • Cloud-Initiated Communications • • • Reversal of the client/server roles – The phone is now the server??!? Phones are not designed to act as servers – No built-in “listener” services Solution: Publish/Subscribe Push – Multiple techniques: HTTP Server Push, Long Polling, XMPP, BOSH, etc. – Shared Notification Services on the device-side – Central service at the device-level, not app-level
  • Push Notifications Server-initiated communication Enable key background scenarios Preserve battery life and user experience Prevent polling for updates
  • Notifications: Different Services Windows 8: Windows Push Notification Service (WNS) Windows Phone: Microsoft Push Notification Service (MPNS) iOS: Apple Push Notification Service (APNS) Android: Google Cloud Messaging (GCM)
  • Push Notifications on Windows Phone Microsoft Push Notification (MPN) Service
  • Push Notifications and Live Tiles • • Push Notifications offer developers a way to send timely information relating to their applications even when they are not running + Windows phone has the unique ability to provide the end user glanceable access to the information they care most about, via Live Tiles
  • Windows Phone Push Notification • • • • • Single connection between the device and notification service Bandwidth- and battery-friendly No guarantee of delivery Dedicated persistent channel to send data to a device from a service Limits – 1 push notification channel per application – 30 push notification channels per device – No push notification limit / day for authenticated web services – 500 push notifications / day for unauthenticated web services Toast Tile
  • Three Kinds of Notifications • • • Raw – Notification message content is application-specific – Delivered directly to app only if it is running Toast – Specific XML schema – Content delivered to app if it is running – If app is not running, system displays Toast popup using notification message content Tile – Specific XML schema – Never delivered to app – If the Tile is currently pinned to the Start screen, system updates it using notification message content 12
  • Push Notification Data Flow 2 URI to the service: Push enabled applications Third-party service "http://notify.live.com/throttledthirdparty/01.00/AAFRQHgiiMWNTYrRDXAH Qtz-AgrNpzcDAwAAAAQOMDAwMDAwMDAwMDAwMDA" Notifications service 3 4 Send PN Message HTTP POST the message 1 Push endpoint is established. URI is created for the endpoint. MPNS: Microsoft hosted server
  • Three Kinds of Notifications • Raw – Notification message content is application-specific – Delivered directly to app only if it is running • Toast – Specific XML schema – Content delivered to app if it is running – If app is not running, system displays Toast popup using notification message content • Tile – Specific XML schema – Never delivered to app – If the Tile is currently pinned to the Start screen, system updates it using notification message content
  • Push Notification Features • • • • • Tile updates can update any display element of each of the Tile templates – Be careful to downgrade updates sent to 7.1 clients 30 subscription endpoints allowed per phone Maximum size of a notification is 1KB for the header and 3KB for the payload. Unauthenticated Web Service limited to 500 push notifications per subscription per day Authenticated Web Services are recommended – Communication uses HTTPS channel – No limit – Able to register a callback request
  • Toast Message Content • Use the following HTTP headers: sendNotificationRequest.ContentType = "text/xml"; sendNotificationRequest.Headers.Add("X-WindowsPhone-Target", "toast"); sendNotificationRequest.Headers.Add("X-NotificationClass", "<batching interval>"); – Where <batching interval> is 3 – Immediate delivery, 13 – delivered within 450 seconds, 23 – delivered within 900 seconds string toastMessage = "<?xml version="1.0" encoding="utf-8"?>" + "<wp:Notification xmlns:wp="WPNotification">" + "<wp:Toast>" + "<wp:Text1>WEATHER ALERT</wp:Text1>" + "<wp:Text2>Stormy</wp:Text2>" + "<wp:Param>/page1.xaml?value1=1234<wp:Param>" + "</wp:Toast>" + "</wp:Notification>";
  • Tile Templates and Tile Sizes • Windows Phone 8 supports three Tile templates – Flip – flips from front to back (similar to the WP 7.1 Tile template) – Iconic – clean iconic layout designed to reflect Windows Phone design principles – Cycle – cycles through up to nine images
  • Tile Message Content • • • • Tile messages are never delivered to the app There are specific schemas for the a Tile update message for each of the three Tile Templates: Flip, Cycle and Iconic – Only Tiles using Flip and Iconic templates can be updated with images at remote URLs – Remote Images limited to 80KB and must download in 30 seconds or less V7.x clients cannot consume these new templates. Recommend you: – In your app, capture the device unique ID, the push URI, the OS version and the app version. Send this data to your Web service registration method – Make sure you only send the new templates to compatible new OS versions/app versions! Use the following HTTP headers: sendNotificationRequest.ContentType = "text/xml"; sendNotificationRequest.Headers.Add("X-WindowsPhone-Target", “token"); sendNotificationRequest.Headers.Add("X-NotificationClass", "<batching interval>");
  • FlipTile Template Tile Message Schema <?xml version="1.0"?> <wp:Notification xmlns:wp="WPNotification" Version="2.0"> <wp:Tile Id="[TileId]" Template="FlipTile"> <wp:SmallBackgroundImage Action="Clear">[sm tile img URI]</wp:SmallBackgroundImage> <wp:WideBackgroundImage Action="Clear">[front of wd tile img URI]</wp:WideBackgroundImage> <wp:WideBackBackgroundImage Action="Clear">[back of wd tile img URI]</wp:WideBackBackgroundImage> <wp:WideBackContent Action="Clear">[back of wd tile content text]</wp:WideBackContent> <wp:BackgroundImage Action="Clear">[front of med tile img URI]</wp:BackgroundImage> <wp:Count Action="Clear">[count]</wp:Count> <wp:Title Action="Clear">[title text]</wp:Title> <wp:BackBackgroundImage Action="Clear">[back of med tile img URI]</wp:BackBackgroundImage> <wp:BackTitle Action="Clear">[back of tile title text]</wp:BackTitle> <wp:BackContent Action="Clear">[back of med tile content text]</wp:BackContent> </wp:Tile> </wp:Notification> • • • Flips from front to back Small size does not flip Medium size is the same as the WP7.1 tile template
  • CycleTile Template Tile Message Schema <?xml version="1.0"?> <wp:Notification xmlns:wp="WPNotification" Version="2.0"> <wp:Tile Id="[TileId]" Template="CycleTile"> <wp:SmallBackgroundImage Action="Clear">[sm tile img URI]</wp:SmallBackgroundImage> <wp:CycleImage1 Action="Clear">[photo 1 img URI]</wp:CycleImage1> <wp:CycleImage2 Action="Clear">[photo 2 img URI]</wp:CycleImage2> <wp:CycleImage3 Action="Clear">[photo 3 img URI]</wp:CycleImage3> <wp:CycleImage4 Action="Clear">[photo 4 img URI]</wp:CycleImage4> <wp:CycleImage5 Action="Clear">[photo 5 img URI]</wp:CycleImage5> <wp:CycleImage6 Action="Clear">[photo 6 img URI]</wp:CycleImage6> <wp:CycleImage7 Action="Clear">[photo 7 img URI]</wp:CycleImage7> <wp:CycleImage8 Action="Clear">[photo 8 img URI]</wp:CycleImage8> <wp:CycleImage9 Action="Clear">[photo 9 img URI]</wp:CycleImage9> <wp:Count Action="Clear">[count]</wp:Count> <wp:Title Action="Clear">[title text]</wp:Title> </wp:Tile> </wp:Notification> • • Cycles between from 1 to 9 images Small tile does not cycle
  • IconicTile Template Tile Message Schema <?xml version="1.0"?> <wp:Notification xmlns:wp="WPNotification" Version="2.0"> <wp:Tile Id="[TileId]" Template="IconicTile"> <wp:SmallIconImage Action="Clear">[sm icon img URI]</wp:SmallIconImage> <wp:IconImage Action="Clear">[med/wd icon img URI]</wp:IconImage> <wp:WideContent1 Action="Clear">[wd tile content line 1]</wp:WideContent1> <wp:WideContent2 Action="Clear">[wd tile content line 2]</wp:WideContent2> <wp:WideContent3 Action="Clear">[wd tile content line 3]</wp:WideContent3> <wp:Count Action="Clear">[count]</wp:Count> <wp:Title Action="Clear">[title text]</wp:Title> <wp:BackgroundColor Action="Clear">[hex ARGB background color of tile]</wp:BackgroundColor> </wp:Tile> </wp:Notification> • Displays a small image in the center of the Tile and is designed to reflect Windows Phone design principles
  • Raw Message Content • Use the following HTTP headers: sendNotificationRequest.ContentType = "text/xml"; sendNotificationRequest.Headers.Add("X-NotificationClass", "<batching interval>"); – • • Where <batching interval> is 3 – Immediate delivery, 13 – delivered within 450 seconds, 23 – delivered within 900 seconds Message Content is application-specific – only gets delivered to running app For example use XML to format data string tileMessage = "<?xml version="1.0" encoding="utf-8"?>" + "<root>" + "<Value1>SomeUserValue<Value1>" + "<Value2>SomeOtherUserValue<Value2>" + "</root>";
  • Hosting Push Service Providers in the Cloud Windows Azure Mobile Services
  • 99.95% Why host in the cloud?
  • Demo: Push Notifications on Windows Phone Microsoft Push Notification (MPN) Service
  • Push Notifications on Windows 8.x Microsoft Windows Notification Services (WNS)
  • Live tiles Local, scheduled, periodic and push updates
  • Toast templates
  • XML badge update schema <?xml version="1.0" encoding="utf-8" ?> <badge value = "1-99" | "none" | "activity" | "alert" | "available" | "away" | ... version? = "integer" />
  • XML tile update schema <?xml version="1.0" encoding="utf-8" ?> <tile> <visual version? = "integer" lang? = "string" baseUri? = "anyURI" branding? = "none" addImageQuery? = "boolean" > <!-- One or more binding elements --> <binding template = "TileSquareImage" | "TileSquareBlock" | ... fallback? = "string" lang? = "string" baseUri? = "anyURI" branding? = "none" addImageQuery? = "boolean" > <!-- Some combination of image and text --> <image id = "integer" src = "string" alt? = "string" addImageQuery? = "boolean" /> <text id = "integer" lang? = "string" /> </binding> </visual> </tile>
  • XML toast notification schema <?xml version="1.0" encoding="utf-8" ?> <toast launch? = "string" duration? = "long" | "short" > <visual version? = "integer" lang? = "string" baseUri? = "anyURI" branding? = "none" addImageQuery? = "boolean" > <!-- One or more bindings --> <binding template = "ToastImageAndText01" | "ToastImageAndText02" | ...="" fallback? = "string" lang? = "string" baseUri? = "anyURI" branding? = "none" addImageQuery? = "boolean" > <!-- Some number of child elements --> <image id = "integer" src = "string" alt = "string" addImageQuery? = "boolean" /> <text id = "integer" lang? = "string" /> </binding> </visual> <!-- Optional audio --> <audio src? = "ms-winsoundevent:Notification.Default" |... loop? = "boolean" silent? = "boolean" /> </toast>
  • Push Notification Lifecycle Overview
  • Windows 8 Push Notifications http://bit.ly/ZAavJJ
  • Demo: Push Notifications on Windows 8.x Microsoft Windows Notification Services (WNS)
  • Push Notifications on iOS Devices Apple Push Notification (APN) Service
  • iOS Push Notifications • • • Push (aka remote) notifications – Introduced in iOS 3.0 & OS X version 10.7 (“Lion”) – Apps must register to receive push notifications – Apple Push Notification service (APNs) is required – Require an SSL certificate per app from Dev Center – Max size for notification payload is 256 bytes Local Notifications – Introduced in iOS 4.0; not available in OS X – Local notifications are scheduled by an app Local and push notifications look & sound the same when shown
  • iOS Push: from Provider to Device • • Providers push to many devices Devices can receive push notifications from many providers • APN Service includes a default Quality of Service (QoS) component that performs a store-and-forward function
  • Android Push Notifications • • • Google Cloud Messaging (GCM) for Android – GCM is a free service by Google – Requires the Google Play Services SDK – Permissions needed: RECEIVE, INTERNET, and WAKE_LOCK (also GET_ACCOUNTS if running on Android < 4.0.4) Need to register in the Google API console to get a Sender ID, used in the registration process to identify third-party app servers – Android apps must register their Application ID to receive messages – Once registered, Android apps get a Registration ID and send it to the thirdparty app server. ID = Given app on a specific device Requires Android 2.2 and Google Play store installed
  • Google Cloud Messaging (GCM) • • • Google-provided GCM Connection Servers (for HTTP or XMPP) Third-party messages are queued & stored (in case the device is offline, one message at a time if collapse_key flag is set, max 100), then sent to the device – Push notification messages can contain up to a 4KB payload – No quotas (Yep, everything is truly free on Android) – Throttling is used to prevent spam/flooding, may cause delivery delays – Wakes the Android app when push message arrives – Android app extracts the raw key/value pairs from the message payload When using the XMPP (CCS) connection server, the client app can send “upstream” messages back to the connection server
  • Summary • • • • • • Push Notifications are an efficient and battery-friendly way of sending notifications from a server to an app on a phone Push Notifications act as another form of multitasking, replacing background apps Pick the right notification type based on your needs Push notifications help your app differentiate itself from the masses in App Stores – Don’t abuse them. Provide added value, not spam Hosting your application server in the cloud makes it easier for mobile devs Windows Azure Mobile Services makes it easy to get started with mobile push on Windows Phone, Windows 8, iOS, Android
  • Mobile Push Resources (Microsoft) • • • • • Windows Phone Tiles & Notifications: http://bit.ly/Y5axJS Windows Phone 8 Jump Start Training - Push: http://bit.ly/Y5ahut Windows 8 Tiles, Badges and Notifications: http://bit.ly/YnPOgn Windows Azure Portal: www.WindowsAzure.com Azure Mobile Services: www.WindowsAzure.com/mobile – Windows 8 Tutorials: www.windowsazure.com/enus/develop/mobile/resources/ – WP8 Tutorials: www.windowsazure.com/en-us/develop/mobile/resourceswp8/
  • Mobile Push Resources (iOS & Android) • • • Apple iOS Local and Push Programming Guide: http://bit.ly/X05046 Google Cloud Messaging for Android: http://bit.ly/YnP9vr Azure Mobile Services: www.WindowsAzure.com/mobile – iOS Tutorials: www.windowsazure.com/en-us/develop/mobile/resources-ios/ – Android Tutorials: www.windowsazure.com/en-us/develop/mobile/resourcesandroid/
  • Next Steps… (Windows Phone) 1 Get Ready to Become a Windows Phone Developer Download the SDK at dev.windowsphone.com Explore the Microsoft samples and start building apps in Visual Studio 2 Learn More About Windows Phone Development via Official Microsoft Videos Windows Phone 8 Jump Start Training: http://bit.ly/wp8jump Windows Phone 8 Dev for Absolute Beginners: http://bit.ly/wp8devAB 3 Check Out Additional Learning Resources Pluralsight WP Training: www.pluralsight.com/training/Courses#windows-phone Nokia Developer: www.developer.nokia.com 4 Download Additional Resources & Become an Expert Download the Windows Phone Toolkit: phone.codeplex.com Nokia Developer Offers: http://bit.ly/nokiadevoffers
  • Next Steps… (iOS) 1 2 3 4 Get Ready to Become an iOS Developer Register for a free account at at developer.apple.com Get/buy a Mac and install Xcode for free from the Apple Mac Store Learn More About iOS Development via Official Apple Videos Official Getting Started Videos: developer.apple.com/videos/ios WWDC Videos: developer.apple.com/wwdc/videos Check Out Additional Learning Resources Pluralsight iOS Training: www.pluralsight.com/training/Courses#ios Twitter List of iOS Experts: twitter.com/ActiveNick/ios-dev-bloggers Download Additional Resources & Become an Expert Explore Free Open Source Controls: www.cocoacontrols.com Try the many developer toolbox products I covered, and more! 49
  • Windows Phone Technical Resources • • • • • • • • • • Windows Phone Developer Blog: blogs.windows.com/windows_phone/b/wpdev Windows Phone Consumer Blog: blogs.windows.com/windows_phone/b/windowsphone Nokia WP Wiki: www.developer.nokia.com/Community/Wiki/Category:Windows_Phone Nokia Dvlup Challenges & Rewards: www.dvlup.com Nokia Conversations Blog: http://conversations.nokia.com Microsoft App Studio: http://apps.windowsstore.com Nick Landry’s Blog: ActiveNick.net Windows Phone Developer Magazine (online): http://flip.it/95YFG GeekChamp (WP & Win8 dev): www.geekchamp.com Windows Phone Central (News): www.wpcentral.com
  • iOS Technical Resources • Official Getting Started Videos – • WWDC Videos – • www.infragistics.com/community/blogs/stevez Torrey’s Blog – • http://iosdevweekly.com Code by SteveZ – • www.pluralsight.com/training/Courses#ios Subscribe to Dave Verwer’s iOS Dev Weekly Newsletter – • developer.apple.com/wwdc/videos Pluralsight iOS Training – • developer.apple.com/videos/ios www.infragistics.com/community/blogs/torrey-betts Twitter List – twitter.com/ActiveNick/ios-dev-bloggers
  • Thank You! Slides and demos will be posted on SlideShare Let me know how you liked this session. Your feedback is important and appreciated. Blog: www.ActiveNick.net Twitter: @ActiveNick Email: activenick@mobility42.com Mobile Apps: www.bigbaldapps.com LinkedIn: www.linkedin.com/in/activenick Website: www.mobility42.com Slideshare: www.slideshare.net/ActiveNick