From the MVPs: “New in Visual Studio 2013 – Windows Azure Mobile Services Integration”


From the MVPs: “New in Visual Studio 2013 – Windows Azure Mobile Services Integration”

  • Comments 2

This is the 33rd in our series of guest posts by Microsoft Most Valued Professionals (MVPs). You can click the “MVPs” tag in the right column of our blog to see all the articles.

Since the early 1990s, Microsoft has recognized technology champions around the world with the MVP Award. MVPs freely share their knowledge, real-world experience, and impartial and objective feedback to help people enhance the way they use technology. Of the millions of individuals who participate in technology communities, around 4,000 are recognized as Microsoft MVPs. You can read more original MVP-authored content on the Microsoft MVP Award Program Blog.

This post is by Client Development MVP John Garland Thanks, John!

New in Visual Studio 2013 – Windows Azure Mobile Services Integration

Windows Azure Mobile Services (aka Mobile Services) is a Windows Azure offering aimed at providing client apps with turnkey access to services that address many of the typical backend needs encountered by mobile applications. These include access to structured data storage, the ability to define server-side business logic that potentially includes integration with 3rd party services, user authentication and authorization, integrated support for push notifications, and support for scheduled script execution. The platform offers several scalability and pricing options which allow a service instance to either grow or contract to meet the needs of the client apps that make use of it, and like most parts of the Windows Azure ecosystem, the Mobile Services feature set is actively being evolved to include more features that address even more common application scenarios.

In the following sections, I’ll go over how Visual Studio 2013 provides built-in support for that not only simplifies configuring your .NET/XAML, JavaScript/HTML5, or C++/XAML Windows Store app projects to work with Mobile Services, but also provides tools to work with your Mobile Services content directly from within the Visual Studio 2013 IDE. In case you’re wondering, this support isn’t limited to the paid Visual Studio SKUs – everything that will be discussed is also available in Visual Studio Express 2013 for Windows.

NOTE: To work with Windows Azure Mobile Services, you will need at least one active Windows Azure subscription. Information about getting started with a free trial account can be found here, and there are also several offers available to participants in the MSDN, BizSpark, and Microsoft Partner Network programs. Also, in order to include Push Notification support in your app, your app will need to be associated with the Windows Store which requires that you have access to a Windows Store Developer account, which you can learn about here.

Getting Started - Connecting Your Windows Store Apps to Mobile Services

Visual Studio 2013 introduces the new Connected Service Manager which provides a central place where you can go to make connections between your project in Visual Studio and online services that it can use – for now these include the Microsoft Ad pubCenter and Windows Azure Mobile Services. To access the Services Manager, select Add Connected Service… from the Project menu or select Add and then Connected Service… from the context menu for your project file in the Solution Explorer. This will bring up the Services Manager dialog in which you can find a Mobile Services entry under Windows Azure. This entry will include all of the existing Mobile Service instances for the Windows Azure subscriptions that you’ve configured Visual Studio to access. If Visual Studio has not yet been configured to interact with the Windows Azure subscription you want to work with, you can use the Import subscriptions… link to optionally retrieve and read a Windows Azure subscription file to include that subscription. You can also use the Server Explorer for more fine-grained control of the service configurations – I’ll talk more about the Server Explorer shortly. Likewise, if you haven’t yet created the Mobile Services instance you want to work with, you can select the Create service… link to bring up the Create Mobile Service dialog from which you can provision a new Mobile Service instance.

clip_image002

Figure 1- Selecting a Mobile Service from the Connected Service Manager

Selecting a service and pressing OK will update your project and prepare it for you to write code to interact with the service you selected. This includes:

· If your project is a .NET/XAML project:

· Importing the WindowsAzure.MobileServices NuGet package. This includes a .NET library that provides a structured API for interacting with Mobile Services and its related dependencies.

· Adding a publicly accessible instance of the MobileServicesClient object named after the selected service to your App class and configuring it with the URL and ApplicationKey for the selected Mobile Services instance.

· If your project is a JavaScript/HTML5 project:

· Importing the WindowsAzure.MobileServices.WinJS NuGet package. This includes a JavaScript file that provides a structured API for interacting with Mobile Services as well as some related files.

· Adding a sevice.js file which declares an instance of the MobileServicesClient object named after the selected service in the global namespace and configuring it with the URL and ApplicationKey for the selected Mobile Services instance.

· If your project is a C++/XAML project:

· Configuring a reference to the Windows Azure Mobile Services C++ Client extension SDK. This provides a library and related header file that provides a structured API for interacting with Mobile Services.

· Adding a class named after the selected service that defines a static GetClient method which returns an instance of the MobileServicesClient object that has been configured with the URL and ApplicationKey for the selected Mobile Services instance.

These instances of the MobileServicesClient can be used throughout your app to communicate with your Mobile Services instance.

Working with Mobile Services Server Content

If you bring up the Server Explorer in Visual Studio 2013, notice that it now includes a Windows Azure entry by default, in which you will see a Mobile Services entry. You can use this node to create and manage your Mobile Services content directly from within Visual Studio. From the Windows Azure entry’s context menu, you can bring up either Import Subscriptions…, Manage Subscriptions…, or Filter Services… to either import, manually configure, or filter which of your Windows Azure subscriptions are shown here and what content is to be displayed. The Import Windows Azure Subscriptions, New Subscription, and Edit Subscription dialogs that you can bring up through the Import and Manage Subscriptions menu items contain links to further instructions to help you with configuring Visual Studio to interact with your Windows Azure subscriptions.

Note that the Mobile Services entry does not yet support the integrated sign-in that was recently added to the Windows Azure management features, so accessing its content still requires the use of management certificates. Support for this feature will be coming in a future update.

Once that is all set up, any existing Mobile Services that exist in these subscriptions will be listed in the Mobile Services node, and you can also create a new Mobile Service from the Mobile Services context menu. Selecting Create Service will show the Create Mobile Service dialog, in which you can provide all of the same information that you would if you were creating the Mobile Service instance form the Windows Azure Management Portal itself.

clip_image003

Figure 2- Creating a Mobile Services Instance from the Server Explorer

The entries in the Server Explorer for your Mobile Services both give you access to information about your Mobile Service instance, as well as provide access to the Data Storage Tables that your service is managing. There is a context menu entry that lets you quickly open your web browser directly to the Windows Azure Management Portal site for the selected service instance. You can open a view of your server log entries into the Visual Studio documents area in order to look at your server health and status, and you can also view your service properties in the Visual Studio Property panel. The properties that are displayed include the service URL, the deployment region, the name and Id for the subscription it was created in, and whether or not it is currently configured to support the Dynamic Schema feature.

clip_image004

Figure 3- Displaying a Mobile Services Instance's Properties

Working with Mobile Services Tables

The Server Explorer service entry lists the current Data Storage Tables that the service is managing, and the context menu can be used to provision a new table. The table entries can be expanded to list their script files, and also include a context menu entry to bring up a dialog for setting the individual table operation permissions.

clip_image005

Figure 4- Working with Mobile Services Tables in the Server Explorer

The script files that are listed within the Data Storage Table nodes can actually be opened for editing within the Visual Studio Editor, where you can take advantage of the Visual Studio 2013 JavaScript editing enhancements. In fact, a JavaScript IntelliSense file has been published by some of the Windows Azure and Visual Studio team members, and with a little tweaking you can get a top-notch integrated editing experience. I’ve previously blogged about how this IntelliSense experience can be enhanced – you can read more about it here.

clip_image006

Figure 5- Displaying Visual Studio JavaScript IntelliSense for Mobile Services Script File Editing

When you save a script file that you opened from the Server Explorer, Visual Studio will upload the modified contents to the Mobile Services instance.

Mobile Services and Git Integration

While accessing and working directly with the scripts stored in the server through the Server Explorer works fine in some instances, at times it may be best to follow a more disconnected approach. Also, the Mobile Services integration in Server Explorer is limited to just the Data Storage tables and their scripts – there is no support at this time for Custom API Scripts, Scheduled Task Scripts, or making reusable script content available through the Shared script folder. One of the options that Mobile Services offers for editing this content offline from the server is through support for the Git distributed source control system, and it so happens that Visual Studio 2013 includes support for working with Git repositories.

To set up your repository, open your Mobile Services instance in the Windows Azure Management Portal and select Set up source control from the Dashboard page. If prompted, set up a set of server credentials. Once completed, you will be taken to the Configuration page, from where you can obtain your Git URL. In Visual Studio, open the Team Explorer panel, select Connect, and in the Local Git Repositories section, select Clone. Paste your Git URL into the top text box and the local path for the code. Press Clone and the complete hierarchy of server scripts that you can edit will be placed in a service folder under the folder that you specified. These files can now be edited locally and you can use Git to track your changes and coordinate synchronizing Commits with your server. I’ve previously blogged about how to use the Visual Studio support for Git with Mobile Services scripts – you can read more about it here.

clip_image007

Figure 6- Cloning a Local Mobile Services Scripts Git Repository

Adding Mobile Services Push Notification Support

The last item to cover is Push Notification support. Visual Studio 2013 includes an Add Push Notification wizard which automates much of the process of configuring your Windows Store App project to participate in push notifications and also prepares your Mobile Services instance to both store notification channels and to be able to send notifications to this particular app. To bring up the wizard, select Add Push Notification… from the Project Menu or by selecting Add and then Push Notification… from the context menu for your project file in the Solution Explorer.

Going through the wizard you will be asked to provide credentials for you Windows Store Developer Account so that your app can be associated either with one of your existing Windows Store app names or a new one that you reserve from within the wizard. You then select which Mobile Services instance you want to associate the app with prior to completing the wizard. When you press Finish to complete the wizard, quite a lot will happen on your behalf:

· Your app project will be associated with the Windows Store entry you selected.

· The Push Notifications configuration of your selected Mobile Service instance will be updated with the Client Secret and Package SID values that correspond to this Windows Store app entry.

· The Live Connect redirect URI corresponding to your app will be updated to match your Mobile Service’s URL.

· If it hasn’t already been done, your app will be connected to the Mobile Services instance you selected as was previously discussed.

· A new channels table will be added to your mobile service to hold Push Notification Channel values used to issue notifications.

· A sample Insert script will be set up for the new channels table. This script contains code to either insert a new device entry or update an existing one, as well as code that is labeled to be moved to the actual location that will be used to trigger the push notifications, such as a Custom API script.

· Code will be added to your project to obtain and send a Push Notification channel to the new Mobile Services channels table, including an entry in your app’s Launch Activation handler to actually execute this added code on each app launch.

If you haven’t yet checked out Mobile Services, hopefully this description has piqued your interest. If you’d like to learn more, you can find additional information about Mobile Services here. Additionally, be sure to check out the Mobile Services Tutorials videos on Channel 9 here, and a video review of the Visual Studio 2013 Tools integration with Visual Studio Windows Azure Tools Program Manager Merwan Hade here.


clip_image009John is a Senior Consultant at Wintellect and a Microsoft Client Development MVP, and has been developing software professionally for the past 15 years. He is the author of the book "Windows Store Apps Succinctly”, and his work has been featured at Microsoft conference keynotes and sessions. Prior to consulting, he spent much of his career working on high-performance video and statistical analysis tools for premier sports teams, with an emphasis on the NFL, the NBA, and Division 1 NCAA Football and Basketball. John lives in New Hampshire with his wife and daughter, where he is an active participant in the New England development community. John is a Windows Azure Insider and also a member of the Azure Mobile Services Advisory Board.

  • Dear John,

    I have configured Visual Studio 2013 Professional (trial) on my Windows 7 (64 bit) machine.  However, I am unable to access the 'Connected Service Manager', which I need to use to manage my Azure back-end Mobile Services.  It doesn't appear to be anywhere in the UI.  Can you please offer some assistance as to the way in which I can access this feature?

    Best wishes,

    Craig.

  • John,

    I seem to have the same problem as Craig. After right clicking the project and clicking Add, I can't see "Connected Service".

    Please help. Thanks

Page 1 of 1 (2 items)
Leave a Comment
  • Please add 2 and 3 and type the answer here:
  • Post