Adding Asp.Net MVC 4 into an existing Asp.Net Webforms Project

Scott ZischerkI had a client that had an existing ASP.Net webforms application and wanted to move to ASP.Net MVC without rewriting the existing web site.  Well, as it turns out, you can!  Since ASP.Net MVC is an abstraction on top of ASP.Net you can run both simultaneously. Here are the steps I followed to get it working.Bootstrapping MVCTo get Asp.NET MVC4 working in an Asp.NET webforms website we need to add a few files and settings.

References

  • MVC
    • System.Web.Mvc.dll
    • System.Web.Optimization.dll
    • System.Web.Providers.dll
    • Newtonsoft.Json.dll
  • Razor View Engine
    • System.Web.Razor.dll
    • WebGrease.dll
    • Antlr3.Runtime.dll

Add Bundle ConfigimageRegisters the JavaScript and CSS bundles. See http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification for more details.

Add Filter Configimage

Registers global filters like error handling and authorization. See http://msdn.microsoft.com/en-us/library/gg416513(v=vs.98).aspx for more details.

Add Route Configimage

Registers the URL routes for the MVC application. See http://msdn.microsoft.com/en-us/library/cc668201(v=vs.100).aspx for more details.

Add/Alter Global.asaximage

The Application_Start method calls the static methods to register the bundles, filters, routes, areas and display modes. This is how MVC starts listening for web requests.

Alter Web.config

Added sections to the web config:

<configuration>.<appSettings>
<appSettings>
    <add key="webpages:Version" value="2.0.0.0" />
    <add key="webpages:Enabled" value="false" />
    <add key="PreserveLoginUrl" value="true" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>
<configuration>.<system.web>.<pages>
<pages>
      <namespaces>
        <add namespace="System.Web.Helpers" />
        <add namespace="System.Web.Mvc" />
        <add namespace="System.Web.Mvc.Ajax" />
        <add namespace="System.Web.Mvc.Html" />
        <add namespace="System.Web.Optimization" />
        <add namespace="System.Web.Routing" />
        <add namespace="System.Web.WebPages" />
      </namespaces>
</pages>
<configuration>.<system.webServer>.<handlers>
<handlers>
  <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
  <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
  <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
  <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." 
verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" 
scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" 
preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
  <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." 
verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" 
scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" 
preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
  <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." 
verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" type="System.Web.Handlers.TransferRequestHandler" 
preCondition="integratedMode,runtimeVersionv4.0" />
</handlers>
<configuration>.<runtime>.<assemblyBinding>
<dependentAssembly>
    <assemblyIdentity name="System.Web.Helpers" publicKeyToken="31bf3856ad364e35" />
    <bindingRedirect oldVersion="1.0.0.0-2.0.0.0" newVersion="2.0.0.0" />
</dependentAssembly>
<dependentAssembly>
    <assemblyIdentity name="System.Web.Mvc" publicKeyToken="31bf3856ad364e35" />
    <bindingRedirect oldVersion="1.0.0.0-4.0.0.0" newVersion="4.0.0.0" />
</dependentAssembly>
<dependentAssembly>
    <assemblyIdentity name="System.Web.WebPages" publicKeyToken="31bf3856ad364e35" />
    <bindingRedirect oldVersion="1.0.0.0-2.0.0.0" newVersion="2.0.0.0" />
</dependentAssembly>
Add Content Folderimage

The Content folder contains the Images, Themes, and CSS for the site. Specific CSS files for individual pages should be named {Controller}.{Action}.css

 Add Views Folderimage

The Views folder contains the desktop and mobile views for the root application subfolders are defined Areas (See Areas). The desktop views have a .cshtml extension and the mobile views have a .mobile.cshtml extension. They are organized into folders that mimic the controller name without the controller suffix on the name.The Shared folder contains the master page and any partial views that may be added to multiple pages like a header and footer.The _ViewStart.cshtml defines any global setting for the views such as which master page to use.

 Add Scripts Folderimage

Contains JavaScript files to load either globally or for a particular page. For page specific javascript files use {Controller}.{Action}.js for the file name.

 Add Controllers Folderimage

Controllers execute the requests made to the ASP.Net MVC website.

 Areas (Sub folders)image

Areas let you organize a large project into multiple smaller sections in order to manage the complexity of a large Web application. Each section (“area”) typically represents a separate section of a large Web site and is used to group related sets of controllers and views.Finished!That’s it!  You should be able to run your MVC pages alongside your WebForm pages.  There is only one caveat, they cannot be in the same directory.  The ASP.Net Webforms will always try executing first in this setup, so you need to have the MVC controllers named something different than the folders in the webforms site.

209 thoughts on “Adding Asp.Net MVC 4 into an existing Asp.Net Webforms Project

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s