When I develop my sites locally using Visual Studio, I like to have the conditions on my local machine match the conditions on the actual web server as closely as possible. Part of doing that is making sure that my urls are formatted the same locally as they will be on the live site. Unfortunately, by default, Visual Studio’s built in web server makes the urls for a local project look a little bit different than they will when the site is actually deployed. This can be remedied quickly with a few changes to your project’s properties.
When you first start a new project up in the debugger, Visual Studio will start the built in web server and open your default web browser with a url that looks something like this:
There are few problems with this url. First, the web server is not running on port 80, so the url contains the port number for the web server. This is an aesthetic problem, but it can also create issues if you plan on having your site behave different based on values that are found in the hostname. For example, if you have a site that has separate subdomains like “people.example.com” and “places.example.com”, and each of those subdomains shares the same codebase, it’s difficult to test that behavior locally if you don’t have your site running on port 80.
A second problem is that instead of having the root url immediately after the hostname, Visual Studio treats “/Demo” as the root of your site. This causes all kinds of problems if you want to use relative urls. It can also cause problems if you want use a url rewriter that relies on regular expressions to determine where a url goes.
Here’s how you can fix it.
Setting the Web Server Properties
To fix the port number and the site root problems, first open the Solution Explorer tab and select your project in the in the list of items.
Next, open the Properties tab and change the “Use dynamic ports” option from True to False. This should allow you to change the Port number to port 80. One issue that I’ve noticed with various versions of Visual Studio, both full and express, is that sometimes you need to close the Properties tab and reopen it before Visual Studio will allow you to change the port number. Finally, change “Virtual path” to “/” so that the root of your site will be immediately after the host name.
Now, when you start up the built in web server, you should be able to access your local site at “localhost”. No port number or project name after the url hostname necessary.
Creating some urls
At this point, the only url where you will be able to access your local site at is “localhost”. This is fine for simple sites, but I always lke to have a url like “matt.dev” where I can access any sites that I’m running on my localhost. That way, if I need to use subdomains, I can access my localhost using a url like “people.matt.dev” or “places.matt.dev”.
To set up these urls you will need to make some entries in your hosts file. Your hosts file is located at “C:\WINDOWS\system32\Drivers\etc\hosts”. I’ll assume that if you’re running Visual Studio under something other than Windows you already know how to get to your hosts file. Open the file with a text editor like notepad. You will see that an entry like this is already there for localhost:
Underneath this entry you can add your own urls that will point to your local web server. Like this:
127.0.0.1 people.matt.dev 127.0.0.1 places.matt.dev
Once you’ve saved your changes to the hosts file, your urls should point to your local webserver.
Finally, if you’d like Visual Studio to use your new urls when opening a website in the debugger, open right click on your project in the Solution Explorer and choose “Property Pages” (what’s the difference between “Properties” and “Property Pages”? That’s just one of life’s little mysteries). Choose “Start Options” and then “Start URL:”. Now you can enter the url you would like the site to start at when you open it in the debugger.
And just for fun, here’s a Ruby script that will do most of this for you.