First published on MSDN on Oct 31, 2018
With the combination of the Engagement feature of Partner Center and the Microsoft Store Services SDK you can easily add Push Notifications to your Windows Progressive Web App (PWA), UWP , or Desktop Bridge - Win32 app .
Push notifications in Windows are very powerful and flexible allowing you to target specific information to specific users. This, however, requires you integrate with the Windows Notifications Service (WNS), set up a server app to send notifications and add code to your client application that registers with WNS. While this gives your business flexibility and one to one targeting, it may be more than what you need. For an excellent walkthrough of setting up WNS Push Notifications, see this post, Push notifications in a PWA running on Windows 10 written by Matteo Pagani .
In contrast to 'WNS', 'Microsoft Store Services Notifications' sends general toast and tile updates to user groups you define. This can be:
Microsoft Store Services notifications also support interactive toast messages which allow users to interact with your app without having to launch it. This requires adding the client code to support the interaction.
Microsoft Store Services notifications can't send information customized for a specific user. For these types of notifications, see 'Powerful Push' above.
To implement the Microsoft Store Services notifications
you will:
1) Install the Microsoft Store Services SDK
2) Add a Reference to the Microsoft.Services.Store.SDK
in your project. See highlighted below:
3) Add the following code to the Start up of your app:
// Setup connection between app and Microsoft Store Services
StoreServicesEngagementManager engagementManager = StoreServicesEngagementManager.GetDefault();
var res = await engagementManager.RegisterNotificationChannelAsync();
4) Associate your app with the Store in Visual Studio. Go to the Project menu -> Store -> Associate App with Store
5) Publish your app to Partner Center using the 'Limited Audience' or
'Hidden' visibility options . You need to do this because in order to setup the push notifications Partner Center will need to explicitly reference your app. In order to do this, your app must be published with a reference to the Microsoft.Services.Store.SDK
. Note that the publishing process can take up to three business days.
6) Once your app has published, you don't need to install it from the Store. You can continue to develop the app - just make sure the identity of the app matches what you have submitted to Partner Center.
7) In the Engagement
section of Partner Center
define and send your Toast and Tile Push Notifications.
7.1. In Partner Center
, select Engage
and you should see the Notifications
page as shown below.
7.2. Click New Notification
7.3. Click Blank Toast
, OK
7.4. From the drop down, select the app or apps to send notifications. See screenshot below:
7.5 Here are some sample values for this toast notification:
Name: My First Engagement Push
Customer Groups: All Users
Send Notification Immediately: Check
Notification Never Expires: Check
Language: English (default)
Activation Type: Foreground
Duration: Short
Scenario: Default
Visual (text 1): Hello from My App!
Click Send
Your notification will be sent immediately it will take up to one minute to receive the notification. Note that the app's registration code (Step 3) should have been run at least once. Note that the app doesn't need to be running in order to receive the notification.
Did it arrive? Yes. High-Five!
No? Here are some things to check:
In the following steps, I'll describe the code found here: https://github.com/Microsoft/Windows-AppConsult-samples-PWA/tree/master/DevCenterNotifications-PWA
This sample implements the registration code (step 3) in a Windows Runtime Component ( PushWinRTComponent ). For easy integration, free free to use it.
PushWinRTComponent exposes the method PushNotifications.init()
that will be called via JavaScript as follows:
// index.html
// Set up Push notifications
if (typeof Windows !== 'undefined' &&
typeof Windows.UI !== 'undefined' &&
typeof Windows.UI.Notifications !== 'undefined') {
PushWinRTComponent.PushNotifications.init().then(
function (result) {
console.log("push init result: " + result);
});
}
Happy Coding!
References:
Send notifications to your app's customers
Push Notifications in a PWA Running on Windows 10
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.