ASP.NET Web Pages - Folder

This chapter introduces folders and folder paths.

In this chapter, you will learn:

  • Logical and physical folder structure
  • Virtual and physical names
  • Web URL and path

Logical folder structure

The following is a typical folder structure of ASP.NET web pages:

Web Pages Folder Structure
  • "Account" folder contains login and security files
  • "App_Data" folder contains database and data files
  • "Images" folder contains images
  • "Scripts" folder contains browser scripts
  • "Shared" folder contains common files (such as layout and style files)

Physical file structure

The physical structure of the "Images" folder of this website is similar to this on the computer:

C:\Johnny\Documents\MyWebSites\Demo\Images

Virtual and physical names

Based on the above examples:

The virtual name of the web image is similar to this: "Images/pic31.jpg".

But the physical name is similar to this: "C:\Johnny\Documents\MyWebSites\Demo\Images\pic31.jpg".

URL and path

The URL is used to access files from the web:

http://www.codew3c.com/html5/html5_intro.asp

The file corresponding to the URL on the server is:

C:\MyWebSites\htm5\html5_intro.asp

The virtual path is a shortened form representing the physical path. If you use a virtual path, you can move the web page to a different domain (or server) without updating the path.

URL	http://www.codew3c.com/html/html5_intro.asp
Server name	codew3c
Virtual path	/html/html5_intro.asp
Physical path	C:\MyWebSites\codew3c\/html/html5_intro.asp

The root directory on the disk drive is written as: C:\, but the root directory on the website is / (slash).

The virtual path of the web folder (almost) never matches the physical folder.

In your code, depending on the content of the code, you may simultaneously refer to both physical paths and virtual paths.

ASP.NET provides three tools for handling folder paths: the ~ operator, the Server.MapPath method, and the Href method.

The ~ operator

To specify the virtual root directory in programming code, please use the ~ operator.

If you use the ~ operator instead of the path, you can move the website to a different folder or location without changing any code:

var myImagesFolder = "~/images";
var myStyleSheet = "~/styles/StyleSheet.css";

Server.MapPath Method

The Server.MapPath method converts the virtual path (/default.cshtml) to a physical path that the server can understand (C:\Johnny\MyWebSited\Demo\default.cshtml).

You will use this method when you need to open a data file located on the server (data files can only be accessed through the complete physical path):

var pathName = "~/dataFile.txt";
var fileName = Server.MapPath(pathName);

In the next chapter of this tutorial, you will learn more about reading and writing data files on the server.

Href Method

The Href method converts paths in the code to paths that the browser can understand (the browser cannot understand the ~ operator).

You use the Href method to create paths to resources (such as images and CSS files).

You will often use this method in HTML <a>, <img>, and <link> elements:

@{var myStyleSheet = "~/Shared/Site.css";}
<!-- Create a link to the CSS file -->
<link rel="stylesheet" type="text/css" href="@Href(myStyleSheet)" />
<!-- Same as above : -->
<link rel="stylesheet" type="text/css" href="/Shared/Site.css" />

The Href method is a method of the WebPage object.