Silverlight Hack

Silverlight & related .NET technologies

About Me

Welcome to Silverlighthack.com.  This is a site where you can find many articles on Silverlight, Windows Phone 7 and .NET related technologies.  

My name is Bart Czernicki.  I have been working with computers since 1988 and have over 12 professional years in the IT field focusing on architecture, technology strategy and product management.  I currently work as a Sr. Software Architect at a large software development company.

Below is the cover of my new book that shows how Silverlight's unique RIA features can be applied to create next-generation business intelligence (BI 2.0) applications.

Silverlight 4 Business Intelligence Soft 

Contact: bartczernicki@gmail.com

View Bart Czernickis profile on LinkedIn

NONE of the comments or opinions expressed here should be considered ofmy past or current employer(s).  The code provided is as-is without anyguarantees or warranties.

Step by step instructions to deploy ASP.NET MVC 3 to Windows Azure

Abstract:  This article will show you the steps to overcome the lack of  Visual Studio 2010/Azure SDK tooling to deploy ASP.NET MVC 3 as a web role to the Azure cloud.  As of the time this article was written, there are many articles out there that overcomplicate the steps and some are even outdated with the new Azure 1.4 SDK release.  This article will allow you to work with the full ASP.NET MVC 3 tooling.  This article will be relevant until Microsoft releases an update to the Visual Studio 2010 tooling for Azure (probably not until the Azure 1.5 SDK).  The Visual Studio 2010 project/source code is included below.

10/01/2011 Update: The latest Windows Azure SDK (September 2011 Update) now includes ASP.NET MVC 3 by default.  However, if you are interested in including ASP.NET MVC4 in Azure, these steps can be followed below (with some changes).

For example, this week a Microsoft employee Avkash Chauhan posted an article called "ASP.NET MVC3 Web Role Deployment in Windows Azure (SDK 1.4) - Detailed steps and Full Sample".  While the article is correct and the process outlined will work, it overcomplicates the steps necessary and there are some bugs in his solution (i.e. you do not get the MVC 3 tooling support, since it is a ASP.NET MVC 2 web role).

Deploying ASP.NET MVC 3 to Azure 1.4 should not include so many steps.

 

Steps to Deploy an ASP.NET MVC 3 web role to the Azure Cloud

The list below are the high level steps that that this article will follow.

  1. Create a new ASP.NET MVC 3 project
    • this can be an Internet or Empty application (or an existing ASP.NET MVC 3 project)
  2. Add a Windows Azure Cloud project
  3. Add the Azure Web Role components to the ASP.NET MVC 3 Project
  4. Add the ASP.NET MVC 3 Assemblies to the bin Folder
    • Deploying via the new Azure 1.4 start up tasks is another method
  5. Publish to Windows Azure
Note: You will need to have some experience with Windows Azure, since I do not cover publishing to the Azure cloud (creating certificates, management console, remote desktop etc.).  You will also need:
  • Visual Studio 2010 SP1
  • ASP.NET MVC 3 with tools update (Released in May 2011: http://www.asp.net/mvc)
    • NuGet Package Manager
  • Azure 1.4 SDK installed
  • Active Windows Azure hosted service account (there is a promotion going on to receive Windows Azure for FREE until September 30th 2011, much better than the FREE 30 day trial if you just want to test things out or run a small blog: http://www.microsoft.com/windowsazure/free-trial/

1) Create a new ASP.NET MVC 3 Project

  1. Open Visual Studio 2010 (as an Administrator)
    • The Azure Cloud emulator needs to run in elevated privaledges
  2. Inside Visual Studio 2010, go to File -> New Project
    • Select "ASP.NET MVC 3 Web Application"
    • I named the project "AspNetMVC3DeployToAzure" *you can call it whatever you like)
    • Select "Internet Application" from the next dialog windo
      • Note that we will not be deploying the ASP.NET membership provider to SQL Azure (that will be for another time)
      • Just as long as you do not click Log On the application will function correctly
  3. If you build the application and debug it, you should see the generic ASP.NET MVC 3 startup screen
 
 

2) Add a Windows Azure Cloud Project

  1. In the Visual Studio 2010 Solution Explorer, right-click on the AspNetMvc4DeployToAzure solution and select Add -> New Project... 
  2. In the New Project Dialog, 
    • select "Cloud" from the Installed Templates
    • select the "Windows Azure Project"
    • I named the project "WindowsAzureAspNetMvc3Deploy" (you can name it whatever you prefer)
  3. In the next dialog, do NOT select any Windows Azure roles.  Leave it empy and click OK.

 

3) Add the Azure Web Role components to the ASP.NET MVC 3 Project

  1. In the Solution Explorer, highlight the ASP.NET MVC 3 project by clicking on it (this will tell Visual Studio the context you are in(
  2. In Visual Studio 2010 (this step will only work if the ASP.NET MVC 3 project is highlighted) go to Tools -> "Library Package Manager" -> "Add Library Package Reference..."
  3. Click "Online" to search the available packages Online
  4. Type in "windowsazure" all one word NO spaces
  5. Select the WindowsAzure.WebRole package and click Install.  Close the dialog after you are done (VS 2010 will ask you to reload the project...click OK) The following changes will be made to the ASP.NET MVC 3 Project:
    • The package will add the necesary Windows Azure SDK 1.4 assemblies
    • The package will make changes necessary in the web.config for Windows Azure
    • The package will add a class that facilitates the new Azure SDK 1.4 change for performign a task when the role is deployed
  6. In the Solution Explorer, right-click on the Roles folder of the Windows Azure project. (this will tell our Windows Azure cloud project that we want to associate to the ASP.NET MVC 3 web role)
    • Select Add -> "Web Role Project in Solution..."
      • In the previous step, we ran the NuGet package that "converted" our traditional ASP.NET MVC 3 application to a web role by adding all the necessary assemblies.  Therefore, this step is telling Azure that we want to add an existing Web Role from our current solution.
  7. In the "Associate with Web Role" dialog, click OK (as we only have one available project)
  8. Your solution should now look like the screen shot below.
    • Note that we have additional Azure assemblies referenced in the ASP.NET MVC 3 project, we have a new class WebRole.cs, the web.config has Azure elements in it and inside the Azure cloud project we have a new web role added
.
  • You can now buiild and debug the solution.  If you did everything properly, this will launch the Windows Azure emulator and run the application.

4) Add the ASP.NET MVC 3 assemblies to the bin folder

Note: the emulator is just an emulator, so it is still utilizing resources on your workstation (i.e. ASP.NET MVC 3, Web Matrix assemblies).  In a real Azure Virtual Machine, you will ONLY have the basic .NET 4.0 assemblies (Microsoft only keeps the VMs to a bare minimum).  Therefore, we need to add those assemblies as part of the deployment into Azure VM.  

Note:  An alternative approach is to utilize the ASP.NET MVC 3 installer as a Azure  start up task (each time the VM is restarted or re-provisioned in case of an error or recovery process) or manually set each assembly to "Copy Local" to True.

 

  1. In the ASP.NET MVC 3 Tools Update Microsoft provides a very easy way to add all the required ASP.NET MVC 3 assemblies automatically for bin deployment. (thanks to Mike Brown from http://azurecoding.net/ for pointing this out).
  2. Right-click on the ASPNetMvc3DeployToAzure MVC 3 project and select "Add Deployable Dependencies..."
  3. Select ASP.NET MVC checkbox and click OK
    • This will add the necessary ASP.NET MVC 3 dependency assemblies.
  4. You Solution Explorer in Visual Studio should look like this after adding the ASP.NET MVC 3 Dependency assemblies.
  5. :
 

5) Publish to Windows Azure

 

  1. Now you are ready to publish to Windows Azure.  Right-click on the Windows Azure project and select Publish.  Select your Azure credentials and storage information.
  • Note: If you do not have the Azure hosted service, storage or credentials set up you will have to create it.  Step by step instructions can be found here (Microsoft has better instructions than I will write on this)
    • I highly recommed you also select the "Enable Intellitrace for .NET 4 Roles".  This will show you any errors that you get if you don't have the proper ASP.NET MVC 3 assemblies installed.  Here is a good article on how you can view the IntelliTrace logs: http://www.nickharris.net/2010/09/how-to-enable-intellitrace-on-windows-azure/.  For exampe, if you forget to enable "Copy Local" to true for the System.Web.Mvc.dll the Azure publish process will cycle and you will not know why.
  • If you forget a certain assembly, you will also get an error like this (if you turn off custom errors in the web.config)
 

Visual Studio 2010 Source Code For Project

 
This source code for this project includes some minor changes unrelated to the steps above:

AspNetMVC3DeployToAzure.zip (13.85 mb)

  • in the web.config I turned custom errors off, so you can see the errors if you receive any in deploying
  • I changed the Windows Azure instance to be "Extra Small", this way you get charged less playing with this and it is covered under the FREE Windows Azure trial
  • I changed the OS family to 2 in the Windows Azure configuration, so that we receive a Windows Server 2008 R2 VM...not sure why that is not the default (?) 
 
 
Summary 
 
In this article, I hope you learned how to deploy an ASP.NET MVC 3 application to the Azure cloud easily.  The key things to remember are:
  • using the WindowsAzure.WebRole NuGet package to convert your ASP.NET MVC 3 application to a web role
  • Associating the ASP.NET MVC 3 project with the Windows Azure Cloud project
  • Using the new "Add Deployment Dependencies.." feature in the ASP.NET MVC 3 Tools Update to deploy all the required ASP.NET MVC 3 assemblies
In the future, Microsoft will no doubt make this process easier and include ASP.NET MVC 3 tooling for Azure deployment.
 
 
Posted: May 15 2011, 09:06 by Bart Czernicki | Comments (3) RSS comment feed |
  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Filed under: ASP.NET MVC | ASP.NET MVC | Azure | Azure
Tags:
Social Bookmarks: E-mail | Kick it! | DZone it! | del.icio.us

ASP.NET MVC 3 Intranet Template with "This resource cannot be found" and User.Identity.Name is blank Error

ASP.NET MVC 3 Tools refresh recently was released and it includes a new Intranet Visual Studio project template.  This template is basically an ASP.NET MVC 3 template with Windows Authentication enabled (the Internet Application template uses forms based authentication).

 
I was recently playing with this template and it worked fine in development and even using the IIS 7.x Express Web Server.  However, when I deployed to a real Windows Server 2008 R2 application I saw this "The resource cannot be found" error:
 
 
So what is going on?  Notice (from the screenshot above) that we are being redirected to .../Account/Login.  This is a clue that the login/authentication is failing. The controller for login is throwing the error.  
 
If you explicitly actually type in /Home/About you will actually get a rendered page below.  Notice in the top right corner all you see is an exclamation point.  The @User.Identity.Name code in the _Layout.cshtml is blank/NULL and causing the error (shown below that is why you only see "Welcome !"). 
 
 
Why is Windows Authentication not working?  It looks to me that this is a bug in the ASP.NET MVC 3 Intranet template....I stumbled upon this by chance, by going through the "known issues" section in the ASP.NET MVC 3 release notes.  It mentions that we should add this line (<add key="enableSimpleMembership" value="false" />) to the web.config if we are upgrading from an ASP.NET MVC 2 application.  This has NOTHING to do BTW with Windows Authentication and I tried adding that key in web.config by chance and it properly authenticated me.
 
After adding the key (and restarting the application pool), ASP.NET MVC 3 properly is able to grab the identity of the user via Windows Authentication.  Basically the appsettings section of the web.config should look like this now:
  <appSettings>
    <add key="webpages:Version" value="1.0.0.0" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
    <add key="enableSimpleMembership" value="false" />
  </appSettings> 
 
If you receive a "This Resource Cannot be Found" error or the User.Identity.Name is blank or IsAuthenticated is false for an ASP.NET MVC application ensure:
  • Windows Authentication is turned on in web.config (IIS 6 and 7)
  • You are using the Integrated pipeline mode in the application pool (IIS 6 and 7)
  • All the wildcard mappings and ISAPI settings are properly set up (IIS 6)
  • Add the key: <add key="enableSimpleMembership" value="false" /> to the appSettings section
  • If you have Kerebos/NTLM etc authentication, make sure it is configured correctly in IIS
I hope this article helped anyone who is going through this annoying issue, as I spent several hours trying to figure it out myself.  It seems like Microsoft needs to update their ASP.NET MVC 3 Intranet template to include this line for production scenarios.
Posted: Apr 13 2011, 16:38 by Bart Czernicki | Comments (0) RSS comment feed |
  • Currently 5/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Filed under: .net | ASP.NET MVC
Tags:
Social Bookmarks: E-mail | Kick it! | DZone it! | del.icio.us

Creating a ASP.NET MVC HTML Helper for Silverlight

Abstract:  This article covers how to  create a custom ASP.NET MVC HTML Helper that will render the required HTML to host a Silverlight application (XAP file). Some knowledge of ASP.NET MVC is required.

Over the last few weeks I have started investing some time in learning ASP.NET MVC (specifically ASP.NET MVC 2).  This has nothing with the ongoing "Silverlight is dead" debate and I actually started a deep dive into the technology back in August 2010.  I think that ASP.NET MVC is very important for Silverlight developers to learn (more on this in another blog post), because of its obvious positioning in Microsoft's HTML5 tooling investments (more on that in MIX 2011).

Intro to HTML Helpers

HTML Helpers have the following qualities:

  • Usually implemented via extension methods
  • Usually implemented part of a static class
  • In .NET 4.0/C# 4.0 utilize optional parameters to minimize the initialization signature
  • Used inline with HTML in ASP.NET MVC Views to create dynamic content, while minimizing the code written and maintained
Basically an HTML helper is a extension method that takes some parameters and renders HTML.  In ASP.NET MVC you have complete control over the rendering of the HTML in your Views.  If you are an ASP.NET developer you can think of it as having the ability to dictate the exact HTML/Javascript that gets surfaced when you drag over any ASP.NET server control.  For example, if you drag over an ASP.NET button server control, ASP.NET handles how that control is rendered on the page.  Of course in ASP.NET you could override the rendering from the server, however it was a major pain.
 
HTML Helpers in ASP.NET MVC are there to minimize how much code you need to write.  For example, instead of having to write 100 lines of HTML every time there is an input form.  You could create an HTML Helper that does this for you.  This minimizes the code, improves maintenance of your code and abstracts that component into its own SRP (single responsibility principle) method.
 
ASP.NET MVC versions 1 through 3 include a ton of HTML Helpers.  These helpers include basic methods for rendering simple HTML like a text box to more complex helpers.  If you download the ASP.NET MVC 3 source code, you will see a lot of very complex HTML Helpers.  These HTML helpers can render complex HTML with interactive HTML.  For example, my companion site (http://www.silverlightbusinessintelligence.com) for my Silverlight business intelligence book utilizes the Twitter HTML helper that renders my tweets in a nice interactive HTML component with JavaScript that makes the appropriate web service requests.  Some of the advanced HTML helpers include: Facebook, Twitter, video etc.  The beauty of this is that in order to utilize this component I just had to reference it using one line of code.
 
 
Creating a Silverlight HTML Helper
 
In order to host a Silverlight application (XAP file) you need to create the following HTML at a minimum  (if you want error handling you will need additional JavaScript):

 
In order to create an ASP.NET MVC HTML Helper to host Silverlight we simply need to create a extension method that renders the HTML shown above.  When creating an HTML helper for an HTML component, you should analyze which parameters would be helpful to make the HTML more dynamic.  For example, for the Silverlight helper we could potentially have the following parameters:
  • URI location of the Silverlight XAP file
  • Silverlight minimum runtime version (minRuntimeVersion parameter)
  • Width and height dimensions of the Silverlight div tag
  • Silverlight application initialization parameters
  • Provide a dynamic name for the onError JavaScript method
In addition to the flexibility, the HTML Helper should provide a simple method signature.  For example, if I just want to provide the location of the Silverlight XAP file; why would I want to pass in all of these additional method parameters.  This is ideal for using the new .NET 4.0/C# 4.0 optional parameter syntax.
 
The rest of the HTML Helper is very simple; combining the method parameters with the static HTML div tag and rendering the content.  You are essentially building a .NET string that contains HTML content.   This can be done several ways (as shown below).  I used the string.Format method (because it uses StringBuilder for performance behind the scenes) and optionally for a cleaner "non-string" method you can use LINQ to XML to create the HTML string all in C#.
 
Creating the HTML using string.Format 

 
Creating the HTML using LINQ to XML

The final piece of the HTML Helper is to return an HTMLString object (which overrides some string method implementations).  The HTMLString object is used by most ASP.NET MVC helpers (considered a best practice).
 
Using the Silverlight HTML Helper
 
Using the Silverlight HTML Helper in an ASP.NET MVC View is incredibly simple.  Using the C# inline code in the view, all that needs to happen is to execute the HTML Helper method.  In the example below, I pass in the URI of the Silverlight XAP file and two optional height & width parameters.
 
If you are not familiar with C# optional parameters, notice the syntax below.  "objectContainerWidth: ...".  We can specify the optional parameter we want to pass into the method and the value.  If the HTML Helper had 20 parameters the syntax of this method would be very bloated.  However, optional parameters make the syntax very terse. 
 
 
 
Where and Why Would you want to do this?
 
There are a couple great uses of this Silverlight HTML Helper.  The first use is to simply host Silverlight applications in ASP.NET MVC.  If you create a "new Silverlight Project" and host it in a ASP.NET MVC project, you don't get a good hosting environment.  What actually happens is that you get an aspx page that is completely outside ASP.NET MVC views. The screen shot below shows the SilverlightApplication2TestPage.aspx page that is a classic ASP.NET page that does not go through the ASP.NET MVC runtime.  This is obviously not helpful if you want to host Silverlight in ASP.NET MVC.
 
 
Another great use of this Silverlight HTML Helper is to create dynamic web sites that include a lot of Silverlight content.  My companion site for my Silverlight BI books had a requirement of this.  I have over 60 Silverlight demos I needed to host on the web with different Silverlight versions.  If you navigate to http://silverlightbusinessintelligence.com/Demos you can see the Silverlight HTML helper in action.  
 
I wanted to keep the Views dynamic.  Therefore, using the Silverlight HTML Helper I can pull all of the values from a SQL Server table and dynamically create the views for each respective demo.  All those optional parameters for the Silverlight HTML helper come from the database.
 
Sample of some of my Silverlight HTML Helper Parameters stored in a database table 
 
 
Source Code
Attached is the cs file for the Silverlight HTML Helper.  Feel free to extend the HTML Helper as you wish.  I have omitted error checking and rendering the additional JavaScript files.  This could be added simply.   I did this on purpose, because right now ASP.NET MVC does not allow you to render JavaScript in the appropriate places.  You could create two separate HTML Helpers (one for the Silverlight XAP file and one for the JavaScript).  This would allow you to place the Silverlight JavaScript file with all your other js files on the web page.
 
Posted: Nov 16 2010, 08:52 by Bart Czernicki | Comments (0) RSS comment feed |
  • Currently 0/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Filed under: ASP.NET MVC | Silverlight
Tags:
Social Bookmarks: E-mail | Kick it! | DZone it! | del.icio.us