ASP.NET MVC & Url Extensions

We got a really cool feature called extension methods in C# 3.0.  This allowed a developer to add methods to existing classes, even sealed ones.  This effectively makes any class extensible even base classes like System.String.  This MSDN article explains in more detail what extension methods are and gives some good examples of adding a WordCount method to the System.String class.  What I want to show you is how I use extension methods to make my life easier when working with ASP.NET MVC.

I use extension methods in ASP.NET MVC probably more than any other project type I work on. There is a static class called simply "Url" which is used to provide some url helpers.  In ASP.NET Webforms, you could prepend a link with "~/" to ensure it was relative to the root of the application as opposed to being relative to the current URL.  With the RESTful nature of URLs with ASP.NET MVC, this can be important to make sure that links function properly and resources like images and CSS files are referenced properly. Using "~/" is specific to ASP.NET and does't work with standard HTML although there are some techniques that can provide the same results with only HTML.

ASP.NET MVC will do some re-writing behind the scenes when referencing links. So let's say that you have a style.css file in the ~/Content folder of your application and you want to reference if from the ~/Views/Shared/Site.Master master page file.  The HTML you can put in the master page to reference the file will look like:

<link href="../../Content/Site.css" rel="stylesheet" type="text/css"/>

Because the physical path of the Site.Master file is two levels deep from the root, using "../../" works.  When the page is built, the ASP.NET runtime will figure out all of the references for you based on the path levels you supply.  However, if you don't use "../../" it won't work.  To get the "~/" goodness, you can use Url.Content and pass in the location of the resource as such:

<link href="<%= Url.Content("~/Content/Site.css")%>" rel="stylesheet" type="text/css"/>

This will work but we can make it more descriptive using extension methods.  Let's add a Style method to the Url class that takes in the stylesheet name.  I'll start by adding a new UrlExtensions static class and a static method StyleSheet:

public static class UrlExtensions
{
  public static string StyleSheet(this UrlHelper helper, string fileName)
  {
    return helper.Content(string.Format("~/Content/{0}", fileName));
  }
}

Extension methods must be static and the first parameter has to be the class that you are wanting to extend.  In this case the UrlHelper class is what we want to add to and it is the type that "Url" is an instance of.  I am using the helper's Content method but passing in only the part that changes.  The extension method will take the filename of our stylesheet so our new stylesheet link will look like:

<link href="<%= Url.StyleSheet("Site.css") %>" rel="stylesheet" type="text/css"/>

What else is kind of cool is if you decide you want to change the overall location of your CSS files, you only need to change the extension method. I usually create one for images and JavaScript files as well.  I also commonly use this method when creating links.  If you look back to my article on routing in ASP.NET MVC, I used a privacy policy as an example.  I can use an extension method to create a url to use in a link:

public static string Privacy(this UrlHelper helper)
{
  return helper.Content("~/privacy");
}

Now I can build a link to the page:

<a href="<%= Url.Privacy() %>">Privacy Policy</a>

I can use named routes in this case and use an action link, but for links that may not have their own route, this is a great method of creating URLs.  It makes your application more maintainable because these links may be in multiple places and you would only have to change it in one place.