Introduction to Building Apps for Office on Windows Azure Web Sites

This post is about a friction free way to get started building Apps for Office by hosting your backend Web application on Windows Azure Web Sites. First,Windows Azure Web Sites are free now in Preview at the time of this blog posting. You can get up to 10 sites free and each site can have multiple instances for scaling out before you need to move up to pay sites. You’ll need to visit and stay tuned to the Windows Azure site, windowsazure.com, for announcements, pricing and features for Web Sites. Additionally, HTTPS is supported on the *.azurewebsites.net domain. If you don’t need your own domain name for your app for Office (using a private domain requires a paid level) then possibly the azurewebsites.net domain will work for you even as your app moves into the Office Store on office.com. Your Apps for Office require HTTPS to be available in the Office Store, but having a private domain is not a requirement. And when an app for Office renders in the Office client, the URL is not seen.

Secondly, Windows Azure Web Sites, as you’ll see, can be managed for the most part, just like you would a typical Web site on IIS. Therefore you do not need the Windows Azure SDK loaded on your dev machine as if you were developing for Windows Azure Cloud Services (although you certainly could build your app for Office on Cloud Services, but that would be another post), so again, it’s the friction free way to get rolling. If you want your app for Office to consume other Windows Azure based services then you would need the Windows Azure SDK, but using Web Sites alone you do not need it.

Prerequisites:

To develop apps for Office you do not necessarily need an Office 365 Developer Site, but you do need to make sure that you have the Office 2013 clients (or you can get these from your MSDN or TechNet subscription) installed on a machine you want to test with. If you use Visual Studio to develop with, you’ll need Visual Studio 2012 Pro or above and the Microsoft Office Developer Tools for Visual Studio 2012 – Preview 2. Once VS 2012 is installed, run the Microsoft Web Platform Installer on your developer machine and search for “Office” you’ll find the above Office/SharePoint tools for building apps to download/install.

Resources for Building Apps for Office:

dev.office.com is your friend for resources on building apps for Office and SharePoint.

Setup a Windows Azure Account:

1. Navigate to windowsazure.com, click on Free Trial. Click through the subsequent pages to create your account.
   
2. Once your account is created login to manage.windowsazure.com if you’re not already logged in.
3. Click on + New to see the WEB SITE Preview menu item, click it and then click QUICK CREATE. (If the WEB SITE menu item is greyed out for you, click on it and follow the link to the right to sign up for the preview program. After you’ve completed the sign up and the service says it’s active you can return to this page.) Enter a name in the URL for your app for Office, this will be verified to be globally unique and available for use by the green checkmark. Select a REGION that is appropriate for you and click CREATE WEB SITE.
   
4. It takes a few seconds for your web site to be provisioned. Once it’s Running click on your app’s Name to enter the dashboard for the web site.
   
5. From the dashboard page, do some exploring by clicking on each of the tabbed items to see the various items you have for managing your new web site. 
    
6. Click on the Dashboard tab and notice the quick glance section on the right. First, right-click on the SITE URL and select to open in a new window or tab. You’ll see the splash page confirming that your site was successfully created. In the browser, change the URL from HTTP to HTTPS, press enter, and you’ll see that your site also supports HTTPS needed for apps for Office. So your site is ready.
   
7. Also, notice that there are a number of other helpful links such as setting up TFS and GIT publishing and FTP is available too. For use with Visual Studio in this post, click the Download publish profile link and save this to a location on your development machine. You’ll use this file later.
   
8. That’s it, for setting up the Windows Azure Web Site, now you just need to build the app for Office and publish it here.

 

Setup a Network Share for the App for Office Manifest file:

1. To remove any dependency on a SharePoint on-premises or Office 365 SharePoint Online as a location for the app for Office to be uploaded, you’ll setup a network share on your developer machine for the manifest file. Open File Explorer on your developer machine and create a folder named AppManifests in the root of the C drive. (note: the folder can be named anything and be located on any drive, this is just a suggested name and location.)
2. Once the folder is created, right-click on the folder and set the sharing with Everyone.

Configure Office Clients to Trust the Network Share for Manifest Files:

1. Open Word 2013 (or any of the clients that support apps for Office) and open a New document. Click the File tab. From the left navigation bar click Options.
   
2. In the Word Options dialog, click Trust Center and Trust Center Settings…
   
3. In the Trust Center dialog, click Trusted App Catalogs and enter in the Catalog Url text box, \\YourMachineNameHere\AppManifests\, and click Add catalog. When the catalog is added, be sure to check the Show in Menu check box. Then click OK. You’ll be prompted that you need to restart Word, but simply close out any open dialogs and Exit Word for now.
   
4. Ok, now your Web Site, network share and Office clients are ready for your app for Office.

Create App for Office:

1. Open Visual Studio 2012 as administrator. Select New Project… In the New Project dialog click on Apps under Office/SharePoint, click App for Office 2013, provide a Name and Location, and click OK.
   
2. In the Create app for Office dialog, leave the default Task Pane app selected and click Finish.
3. Since this post is about how to simply deploy an app for Office to Windows Azure Web Sites so you can see the pattern for doing this, you will make no changes to this base web app, you will simply publish it. Right-click on the web project and select Publish…
   
4. In the Publish Web dialog, click Import… and navigate to the location where you saved the “publish profile” above.
   
5. Click Next on subsequent screens until you see the Start Preview button, it’s not necessary that you click this but it’s interesting to see the files that will be deployed. You will notice in subsequent deployments that you do, only those elements that have changed will be uploaded. On the first time all items get uploaded of course and this button shows the individual items. Once the upload items are determined, click Publish.
   
6. When the publish completes, a browser will open for your web site. Append to the end of the URL, /Pages/YourVS-AppName.html and press enter to see your deployed app. Your URL should look something like, https://appforofficetest1.azurewebsites.net/Pages/OfficeApp3.html.  Since you do not have a default page setup for the site (which you can in the management portal for this Web Site) you need to add the path to your deployed page.  Your deployed page should look like the following. But of course you’re not in the context of Office so things appear to not work – but the app for Office is deployed.
   
7. Change the URL to HTTPS, press enter, and copy/paste it into Notepad or somewhere for use later.
8. Now, back to Visual Studio.

Deploy the App for Office Manifest file to the File Share:

1. Since apps for Office are essentially a manifest file that the Office clients can access and the manifest file simply contains the URL for your web site, all you will do here is save a copy of the manifest file in your network share and update the SourceLocation element in the manifest with the full HTTPS URL for your Windows Azure Web Site.
2. In Visual Studio, right-click on your app for Office “folder” (not “project”) and select Open Folder in File Explorer.
   
3. In File Explorer, right-click your app for Office XML file and select Copy.
   
4. Open another File Explorer and open your AppManifests folder and Paste your app for Office manifest.
5. Open your newly pasted app for Office manifest file in Notepad or any text editor and locate where you saved a copy of your full HTTPS URL in an above step. Copy the URL and paste it into the SourceLocation element in your manifest file. The element should look something like the following, then Save and Close the edited manifest file.
   
6. Ok, almost there!

 

Test your App for Office:

1. Open Excel 2013 and open a blank workbook.
2. Click the Insert tab, click on Apps for Office, from the drop-down select See all…
   
3. Click the SHARED FOLDER tab to see the apps for Office manifests available in your network share. Select your app for Office and click Insert.
   
4. Your app for Office hosted on a Windows Azure Web Site, in a Microsoft Data Center, in the Region you chose is displayed in Excel – how cool is that for friction free? Click on any cell in Excel and press the Set data button and then click into any other cell, enter some data, exit the cell and then reselect it, and click Get data.
   

As you can see (and you had a couple configuration steps here for the network share and Office that only need to be done once) it is really a simple process to spin up a Windows Azure Web Site for hosting an app for Office. Essentially you build your web application (it can be written in any language that is supported on IIS and the Office JavaScript Object Model), publish it to Windows Azure Web Sites using a number of methods from TFS, Git, Web Deploy, or FTP, and wire up Office to access your manifest file on a network share (or SharePoint on-premises, or SharePoint Online in Office 365) and you’re set.

This post is meant to only provide an introduction to simply show the pattern for using Windows Azure Web Sites as a backend for apps for Office. But for next steps you would need to think about whether your app for Office needs to support multi-tenancy. If so, you may need to couple a Windows Azure SQL Database with your Web Site. Here again, you should check back on the windowsazure.com site and click on the pricing tab to run some numbers along with what will it mean when you hit the maximum instances/capacity on your free site and need to start moving into the pay-as-you-scale-out dynamic. But, in any case, Windows Azure Web Sites are a super option to start with where the risks and costs have a very low barrier for entry.

So start building your Apps for Office on Windows Azure Web Sites today!

Enjoy!