Updated NotificationsExtensions WnsRecipe Nuget to support Windows 8.1 templates now available

A short post to let you know that I have just published the updated NotificationsExtensions WnsRecipe Nuget with support for the new notification templates that were added in Windows 8.1.

Here is a short demonstration of how to use it to send a new TileSquare310x310ImageAndText01 template with the WnsRecipe Nuget Package

Install the package using Nuget Package Manager Console. (Note you could also do this using Manage package references in solution explorer)

install-package WnsRecipe

Add using statements to the NotificationsExtensions namespace

using NotificationsExtensions;
using NotificationsExtensions.TileContent;

New up a new WnsAccessTokenProvider and provide it your credentials configured in the Windows Store app Dashboard

private WnsAccessTokenProvider _tokenProvider = new WnsAccessTokenProvider("ms-app://", "");

Use Tile Content Factory to create your tile template

var tile = TileContentFactory.CreateTileSquare310x310ImageAndText01();

tile.Image.Src = "https://nickha.blob.core.windows.net/tiles/empty310x310.png";
tile.Image.Alt = "Images";
tile.TextCaptionWrap.Text = "New Windows 8.1 Tile Template 310x310";

// Note you really should not do the line below :) , 
// instead you should be setting the required content 
// through property tile.Wide310x150Content so that users
// get updates irrespective of what size tile they have pinned to Start
tile.RequireWide310x150Content = false;  

//Send the notification to the desired channel
var result = tile.Send(new Uri(channel), _tokenProvider);

and here is the output
310x310tile

Enjoy, Nick Harris

How to handle WNS Response codes and Expired Channels in your Windows Azure Mobile Service

When implementing push notification solutions for your Windows Store apps many people will implement the basic flow you typically see in a demo then consider their implementation as job done. While this works well in demos and apps that are running at a small scale with few users those that are successful will likely want to optimize their solution to be more efficient to reduce compute and storage costs. While this post is not a complete guide I am providing it to at least give you enough information to get you thinking about the right things.
A few quick up front questions you should ask yourself are:

  • Is push appropriate? Should I be using Local, Scheduled or Periodic notifications instead?
  • Do I need updates at a more granular frequency then every 30 minutes?
  • Am I sending notifications that are personalized for each recipient or am I sending a broadcast style notification with the same content to a group of users?

A typical implementation

If you figured out push is the right choice and implemented the basic flow it will normally look something like this:

 

  1. Requesting a channel
  2. using Windows.Networking.PushNotifications;
    …
    var channel = await PushNotificationChannelManager.CreatePushNotificationChannelForApplicationAsync();
    
  3. Registering that channel with your cloud service
  4. var token = Windows.System.Profile.HardwareIdentification.GetPackageSpecificToken(null);
    string installationId = Windows.Security.Cryptography.CryptographicBuffer.EncodeToBase64String(token.Id);
    
    var ch = new JObject();
    ch.Add("channelUri", channel.Uri);
    ch.Add("installationId", installationId);
    
    try
    {
       await App.pushdemoClient.GetTable("channels").InsertAsync(ch);
    }
    catch (Exception exception)
    {
       HandleInsertChannelException(exception);
    }
    
  5. Authenticate against WNS and sending a push notification
  6. //Note: Mobile Services handles your Auth against WNS for your, all you have to do is configure your Store app and the portal WNS credentials.
    
    function SendPush() {
        var channelTable = tables.getTable('channels');
        channelTable.read({
            success: function (channels) {
                channels.forEach(function (channel) {
                    push.wns.sendTileWideText03(channel.uri, {
                        text1: 'hello W8 world: ' + new Date().toString()
                    });
                });
            }
        });
    }
    

And for most people this is about as far as the push implementation goes. What many are not aware of is that WNS actually provides two useful pieces of information that you can use to make your push implementation more efficient – a Channel Expiry time and a WNS response that includes both notification status codes and device status codes using this information you can make your solution more efficient. Let’s take a look at the first one

Handling Expired Channels

When you request a channel from WNS it will return to you both a channel and an expiry time, typically 30 days from your request. Consider that your app over time is popular but you do have users that over time end up deciding either to not use your app for extended periods or delete it all together. Over time these channels will hit their expiry date and will no longer be of any use and there is no need to a) send notifications to these channels and b) keep these channels in your datastore. Let’s have a look at a simple implementation that will cleanup your expired channels.

Using a Scheduled Job in Mobile Services we can perform a simple clean of your channels but first we must send the Expiry to your Mobile Service. To do this you must update step 2 of the above implementation to pass up the channel expiry as a property in your JObject – you will find the channel expiration in the channel.ExpirationTime property. For my channel table I have called this Expiry.

Following that once you have created your scheduled push job at say an interval of X (I am using 15 minutes) you can then add a function that deletes the expired channels similar to the following

function cleanChannels() {
    var sql = "DELETE FROM channels WHERE Expiry < GetDate()";
    mssql.query(sql, {
        success: function (results) {
            console.log('deleting expired channels:', results)
        },
        error: function (error) {
            console.log(error);
        }
    });
}

As you can see there is no real magic here and you probably want to handle UTC dates – but in short it demonstrates the concept that the expired channels are not useful for sending notifications so delete them, flag them as deleted or anything else that keeps them out of the valid set that you will push to… moving on

Handling the WNS response codes

When you send a notification to a channel via WNS, WNS will send a response. Within this response are many useful response headers. Today i’ll just focus on X-WNS-NotificationStatus but it’s worth noting that you should also consider X-WNS-DeviceConnectionStatus – more details here

Let’s look at a typical response:

{
headers:
{ ‘x-wns-notificationstatus’: ‘received’,
‘x-wns-msg-id’: ’707E20A6167E338B’,
‘x-wns-debug-trace’: ‘BN1WNS1011532′ },
statusCode: 200,
channel: ‘https://bn1.notify.windows.com/?token=AgYAAACghhaYbZa4sqjJ23pWp3kGDcEOEb3JxxdeBahCINn15fc11TiG0mlTpR5heYQmEaQrgZc3TSSwoUllW9s4Lsn3eyvSn19DcrX%2bOvSOY4Bq%2bPKGWbdy3mjTmaRi2Yb1dIM%3d’
}

Of interest in this response is X-WNS-NotificationStatus which can be one of three different states:

  • received
  • dropped
  • channelthrottled

As you can probably guess if you are sending notifications when you are either throttled or dropped it is probably not a good use of your compute power and as such you should really handle channels that are not returning received status in a fitting way. Consider the following when the scheduled job runs delete any expired channels and send notifications to channels in (the status of received) OR (that are not in the status of received AND that last had a push sent over an hour ago). This can be easily achieved by tracking the X-WNS-NotificationStatus every time a notification is sent. Code follows:

function SendPush() {
    cleanChannels();
    doPush();
}

function cleanChannels() {
    var sql = "DELETE FROM channel WHERE Expiry < GetDate()";

    mssql.query(sql, {
        success: function (results) {
            console.log('deleting expired channels:', results)
        },
        error: function (error) {
            console.log(error);
        }
    });
}

function doPush() {
    //send only to received channels OR channels that are not in the state of received that last had a push sent over an hour ago 
    var sql = "SELECT * FROM channel WHERE notificationStatus IS NULL OR notificationStatus = 'received' 
                    OR ( notificationStatus <> 'received'
                           AND CAST(GetDate() - lastSend AS float) * 24 >= 1) ";

    mssql.query(sql, {
        success: function (channels) {
            channels.forEach(function (channel) {

                push.wns.sendTileWideText03(channel.uri, {
                    text1: 'hello W8 world: ' + new Date().toString()
                }, {
                    success: function (response) {
                        handleWnsResponse(response, channel);
                    },
                    error: function (error) {
                        console.log(error);
                    }
                });
            });
        }
    });
}

// keep track of the last know X-WNS-NotificationStatus status for a channel
function handleWnsResponse(response, channel) {
    console.log(response);

    var channelTable = tables.getTable('channel');

    // http://msdn.microsoft.com/en-us/library/windows/apps/hh465435.aspx
    channel.notificationStatus = response.headers['x-wns-notificationstatus'];
    channel.lastSend = new Date();

    channelTable.update(channel);
}

That’s about it I hope this post has helped you to start thinking about how to handle your Push Notification implementation beyond the basic 101 demo push implementation

Enjoy, Nick Harris

Building Mobile Apps with Windows Azure Content from BUILD 2012

//BUILD 2012 was an awesome event! this post is a little late.  Although late this content is still extremely relevant if you are building Connected Mobile Apps. Here are a couple of sessions you should watch:

Keynote Demo of Windows Azure Mobile Services
During //BUILD 2012 I was fortunate enough to be to be on point for delivering the day 2 Mobile Services keynote demo app Event Buddy.  If you have not watched this keynote demo I would recommend you check it out – the Mobile Services Demo starts about 10mins 30 seconds in


Direct Video link on Channel9.  Event Buddy is now also available as a Code Sample that you can download here.

Developing Mobile Solutions on Windows Azure – Part I

Watch Josh take a Windows Phone 8 + Windows Store application and light it up with cloud services to handle data, authentication and push notifications – right before your eyes with Windows Azure Mobile Services. Almost all demo and no slides, this session is designed to take you from zero to Mobile Services here in 60 minutes.

You can also watch this video directly on Channel 9 here.
Developing Mobile Solutions on Windows Azure – Part I

In addition to this I also presented with fellow baldy – Chris Risner.  In this session we took the output of Part I  from Josh and demonstrated how you could extend your existing applications to support common scenarios such as geo-location, media, and cloud to device messaging using services from Windows Azure.   Here a summary of the content of this presentation that I humbly grabbed directly from a prior post by Chris

  • We took pictures and uploaded them to Blob Storage.  For this we used a web service layer, running in Windows Azure Websites, to get a SAS (Shared Access Signature) which allowed us to securely upload to blob storage.
  • We then got the location of the device and used that information to geo-tag the pictures we just uploaded.
  • We added a web page to our web service which allowed a user to select a geographical area on a map and request a push notification be sent to anyone that had taken a picture inside of it (this used the Bing Maps API and Queues from Windows Azure Storage)
  • We deployed a worker role to Windows Azure Cloud Services which would check the queue and then figure out who should be notified (using Entity Framework’s geospatial support) and sent out the actual push notifications to both the Windows 8 and Windows Phone 8 clients.

Here is the direct link to watch on Channel 9 and Chris has also made the code available here
Enjoy,

Nick Harris

New Windows Azure Mobile Services Getting Started Content

This post is a cross post of my post on the official Windows Azure Blog

It’s been less than five months since we introduced the first public preview for Windows Azure Mobile Services and in this short time we have seen continual additions to the Mobile Service offering including:

  • SDKs for Windows Store, Windows Phone 8 and iOS apps
  • Auth using Microsoft Account, Facebook, Google and Twitter
  • Push Notification support via WNS, MPNS and APNS
  • Structured storage
  • Scheduler to execute tasks on a schedule e.g aggregating feeds, sending notifications, crunching data
  • Deployment in North Europe, East and West US datacenters

This post details wealth of new content we have recently released designed to help you get started with Windows Azure Mobile Services including Videos, Code Samples and Tutorials.

New Videos

We recently launched a new Windows Azure Mobile Services series to help people get started with Mobile Services.  Through this series you will learn how Mobile Services can:

  • Provide turnkey backend solutions that connect your mobile apps to the cloud within minutes
  • Store data off device and read it back into your apps
  • Add custom business logic utilizing server scripts
  • Implement user authentication in your apps using popular social identity providers such as Microsoft Account, Facebook, Twitter and Google.
  • Implement Push Notifications in your apps to keep your users up to date with your latest app content
  • Execute tasks on a schedule e.g aggregating feeds, sending notifications, crunching data etc.
  • Accelerate your mobile app development for Windows Store, Windows Phone 8 and iOS

Here are some quick links to the current videos within the series:

Scott Guthrie

Introduction to Windows Azure Mobile Services

Nick Harris

Creating your first app using the Windows Azure Mobile Services Quick Start

Nick Harris

Connecting your Windows Store app to Windows Azure Mobile Services

Nick Harris

Validate and Modify Data with Server Scripts in Windows Azure Mobile Services

Nick Harris

Getting Started with Authentication in Windows Azure Mobile Services

Nick Harris
Authenticate and Authorize users with Server Scripts in Windows Azure Mobile Services
Nick Harris
Add Push Notifications to your apps with Windows Azure Mobile Services
Nick Harris
Getting Started with the Windows Azure Mobile Services Scheduler
Josh Twist
iOS Support in Windows Azure Mobile Services
Chris Risner
Creating your first iOS app with the Windows Azure Mobile Services Quick Start

New Code Samples

In addition to the video series, we have released a number of code samples to the MSDN Code Gallery.  These samples demonstrate step-by-step how you can use the key functionality available within Windows Azure Mobile Services in your Windows Store apps.  Below is a list of the new code samples:

Geolocation sample end to end using Windows Azure Mobile Services  (New)

This sample provides an end to end location scenario with a Windows Store app using Bing Maps and a Windows Azure Mobile Services backend. It shows how to add places to the Map, store place coordinates in a Mobile Services table, and how to query for places near your location.

Enqueue and Dequeue messages with Windows Azure Mobile Services and Services Bus (New)

My Store – This sample demonstrates how you can enqueue and dequeue messages from your Windows Store apps into a Windows Azure Service Bus Queue via Windows Azure Mobile Services. This code sample builds out an ordering scenario with both a Sales and Storeroom and app.

 Capture, Store and Email app Feedback using Windows Azure Mobile Services  (New)

This sample shows how you can implement a Feedback charm option in your Windows Store application and submit the feedback to be both stored Windows Azure Mobile Services and emailed directly to you.

 

Upload File to Windows Azure Blob Storage using Windows Azure Mobile Services  (New)

This demonstrates how to store your files such as images, videos, docs or any binary data off device in the cloud using Windows Azure Blob Storage. In this example we focus on capturing and uploading images, with the same approach you can upload any binary data to Blob Storage.

 

Create a Game Leaderboard using Windows Azure Mobile Services (New)

The My Trivia sample demonstrates how you can easily add, update and view a leaderboard from your Windows Store applications using Windows Azure Mobile Services.

Event Buddy Sample – Storage, Auth and Push Notifications with Mobile Services  (New)

In this sample you will start with a disconnected Windows Store app that manages events & sessions. You will connect it to Windows Azure Mobile Service to provide structured storage, auth using Twitter or Facebook and push notifications.

 

Authenticate Microsoft Account, Facebook, Twitter and Google w/ Mobile Services (New)

This sample demonstrates how you can easily wire up your Windows Store application to require your users to Authenticate against well know social identity such as Microsoft Account, Facebook, Twitter and Google using Windows Azure Mobile Services.

 

Tile, Toast and Badge Push Notifications using Windows Azure Mobile Services (New)

This sample demonstrates how you can easily register a channel in Windows Azure Mobile Services and then send different types of push notifications such as tile, toast and badge notifications from a server side script to your client application.

 Raw Notifications using Windows Azure Mobile Services (New)

This sample demonstrates how you can easily send Raw push notifications to your Windows Store apps using Windows Azure Mobile Services.

Send Push Notifications at Periodic Interval with the Mobile Services Scheduler (New)

This sample demonstrates how you can offload work from your Windows Store app to be processed on a scheduled basis using Windows Azure Mobile Services. It shows how to create a Scheduled Script that polls a feed and send a Push Notification to update the tile with latest news.

For a full list please see the new Code Sample Page on Windows Azure

Tutorials

There are a number of great step-by-step tutorials that cover Getting Started, Data, Auth, Push Notifications, Services and Tools.  We recently added two new tutorials that demonstrate how to:

These tutorials are available for Windows Store, Windows Phone 8, and iOS apps.

I hope this new content combined with our offer of 10 FREE Mobile Services helps get you off to a flying start!  That’s all from me for now, if there is new content that you would like to see made available please feel free to reach out to me with your suggestions.

As always, please visit our forum if you have any questions and send any feedback to mobileservices@microsoft.com.

Happy Coding!

Nick Harris
@cloudnick | Blog

Blog Series: Sending Windows 8 Push Notifications using Windows Azure Mobile Services

Sending Windows 8 Push Notifications using Windows Azure Mobile Services

Recently we announced the preview of Windows Azure Mobile Services. In this blog series I will detail how to build a Windows Azure Mobile Service to send push notifications of varying types to your Windows 8 applications.

This series will walk through creating a push notification scenario using WNS and Windows Azure Mobile Services.

As I post each part I will update the links below and tweet as the post is available. So lets get started with Part 1 - Azure Mobile Services and Push Notifications an Overview

Part 1: Windows Azure Mobile Services and Push Notifications an Overview

What is Windows Azure Mobile Services?

Here is an info-graphic on the current Windows Azure Mobile Services stack I pulled together as part of a presentation I recently gave at TechEd.  It’s important to note that this info-graphic captures Mobile Services today and over time you will see the feature set of Mobile Services grow exponentially with subsequent releases.

 

 

 

 

 

 

 

 

 

 

The goal of Windows Azure Mobile Services is to make it incredibly easy for developers to add a cloud backend to their client apps be it a Windows 8, Windows Phone, iOS or Android application. To do this we provide a number of turn key features baked right into the Mobile Services experience. As the diagram depicts Mobile Services today provides:

  • Structured Storage
    • ability to store structured data to a SQL Database using dynamic schema without being concerned with writing underlying T-SQL.
    • If using single database apps are automatically partitioned by schema e.g AppX.Todoitem, AppY.Todoitem
    • If you want access to your data you are not locked out and can manage it in a number of ways including the Mobile Service Portal, SQL Portal, SQL Management Studio, REST API etc.
  • Server Logic
    • Service API: Mobile services automatically generates a REST API to allow you to perform CRUD operations from your client application on your structured storage
    • With Dynamic Schema (enabled by default), your Mobile Service will automatically add columns to tables as necessary to store incoming data.
    • Ability to author server side business logic directly in the portal that is executed directly within the CRUD operation pipeline
  • Auth
    • Makes it easy for your users to Authenticate against Windows Live. Other major identity providers are coming soon.
    • The REST API can be locked down using table level permissions using a simple drop down.  No complex code required.  Available permissions levels include: Everyone, Anyone with an Application Key, Only Authenticated Users, Only Scripts and Admins.  These permissions can be set individually on each table and can granularly control each CRUD operation of each table.
    • More granular control can be added using server side scripts and the user object
  • Push Notifications
    • Integrates with WNS to provide Toast, Tile and Badge Notifications.
    • WNS auth is made easy with the portal captures your WNS client secret and package SID
    • the server side script push.wns.* namespace  performs WNS auth for you and provides a clean and easy object model to compose notifications
  • Common tenants of Windows Azure Services
    • Scale
      • Compute - scale between shared and reserved mode, increase/decrease your instance count
      • Storage - ability to scale out your mobile service tenant(s) to a dedicated SQL DB. Ability to scale up your SQL DB from web through business to 150GB.
    • Diagnostics
      • View diagnostics directly in the portal including API calls, CPU time and Data Out
    • Logging
      • Console.* operations like console.log and console.error provide an easy means to debug your server side scripts.

Today we provide client libraries for Windows 8 to make consuming mobile services easy.  For more details on what client libraries (Windows 8, Windows Phone, iOS and Android) are supported at the time of reading please see: Mobile Services and Mobile Service Reference.

What are Push Notifications?

The Windows Push Notification Services (WNS) enables you to send toast, tile, badge and raw notifications from the cloud to your Windows Store applications even when your app is not running. Push notifications are ideal for scenarios when you need to target a specific user with personalized content.

The following diagram depicts the general Lifecycle of a push notifications via the Windows Azure Notification Service (WNS).  We’ll walk through the steps shortly but before doing so I thought it would be important to call out that as a developer implementing a push notification scenario all you need to do is implement those interactions in grey and the applications/services in blue.  Fortunately Mobile Services makes a great deal of this easy for you as you will see throughout the reset of this series. 

The process of sending a push notification boils down to three basic steps:

  • 1. Request a channel. Utilize the WinRT API to request a Channel Uri from WNS.  The Channel Uri will be the unique identifier you use to send notifications to your application.
  • 2. Register the channel with your Windows Azure Mobile Service.  Once you have your channel you can then store your channel and associate it with any application specific data (e.g user profiles and such) until your services decide that it’s time to send a notification to the given channel.
  • 3. Authenticate and Push Notification to WNS. To send notifications to your channel URI you are first required to Authenticate against WNS using OAuth2 to retrieve a token to be used for each subsequent notification that you push to WNS once you have this you can compose and push the notification to the channel recipient. The push.wns.* methods make this task exceptionally quick to accomplish compared to writing it all from scratch yourself.

All in all Windows Azure Mobile Services makes all these concepts and steps and incredibly simple to implement though its structured storage and push notifications features.  This series will walk through creating a push notification scenario using WNS and Windows Azure Mobile Services.

As I post each part I will update the links below and tweet as the post is available

Enjoy,

Nick

Building Connected Windows 8 Apps with Windows Azure

Hey – I thought I would share this video, deck and completed demo for all of you who attended my TechEd North America + Europe sessions

Are you building a connected Windows Metro style app? This session introduces you to Windows Azure and demonstrates how you can build connected experiences for your Windows 8 Metro style apps. After walking the through the fundamentals of both platforms, we take a deep dive as we demonstrate how you can use Windows Azure to support common geo-location, multimedia, data and push notification scenarios. At the end of this session, you will be empowered to begin building and deploying your own Windows 8 client applications that are powered by Windows Azure

You can download the full video in high res from channel 9 here

Download the deck Here
Download the source Here Note I have removed the connection strings for SQL + Windows Azure storage + Bing Maps. You will find all places that you need to replace these by doing a search for TODO-REPLACE. Enjoy!

Kind Regards,
Nick

Sending Language specific Push Notifications to Windows 8 using the WnsRecipe

I was recently asked to help out with a MSDN forum post on how the WnsRecipe NuGet package can be used to send Push Notifications via WNS to Windows 8 Metro app clients.  Essentially here are the steps.

Note: This post assumes you have already created a client app, requested test credentials for WNS and received a notification channel in your cloud service.  If you have not yet done this I would recommend you watch this episode of cloud cover where I demonstrate the setup:

If you want to download the hi def version here is the direct link to Channel 9 for this episode .

Now that you have watched the pre-req the rest is really quite simple.

Install the WnsRecipe NuGet into your solution using the NuGet Package Manager

  • Right click on your project and select ‘Manage NuGet Packages’
  • Select Online and search for WnsRecipe and press Install
    using NotificationsExtensions; 
    using NotificationsExtensions.TileContent;
    
  • Use the recipe as per normal but recall to set the appropriate BCP 47 language code  for your wideTile.Lang and squareTile.Lang properties
    //new up an access token provider with your credentials
    IAccessTokenProvider tokenProvider = new WnsAccessTokenProvider("<your package sid>", "<your client secret>");     
    var uri = new Uri("<your endpoint uri>");
    
    //Create the wide tile
    ITileWideText09 wideTile = TileContentFactory.CreateTileWideText09();     
    wideTile.Lang = "de-DE";     
    wideTile.TextHeading.Text = "Test-Paket";     
    wideTile.TextBodyWrap.Text = "ä";
    
    // new up a square tile to send down with the wide tile
    // as you do not know if the user has pinned the tile to small or wide
    ITileSquareText02 squareTile = TileContentFactory.CreateTileSquareText02();     
    squareTile.Lang = "de-DE";     
    squareTile.TextHeading.Text = "Test-Paket";     
    squareTile.TextBodyWrap.Text = "ä";     
    
    // set the square tile content
    wideTile.SquareContent = squareTile;
    
    //Send notification - note you should pay attention to the Status codes coming back from the 
    //send operation in the result variable.
    var result = wideTile.Send(uri, tokenProvider);
    
  • And that’s basically it as mentioned above this is a somewhat fragment sample. Please do watch the Cloud Cover episode if you require more detail

For a full list with screenshots of the different tile template types please see this MSDN reference