Search code examples
asp.net-coreasp.net-core-mvc

Why do we have to use "~/" at the beginning of our file path extensions?

I'm trying to learn ASP.NET Core. I'm still at the beginner level. Sorry if my question is too simple.

I want to access the CoreBlogTeam/web/images/b1.jpg image from /Views/Blog/BlogReadAll.cshtml:

<img src="~/CoreBlogTema/web/images/b1.jpg"
<img src="/CoreBlogTema/web/images/b1.jpg"

Both file extensions img work.

I researched the topics Physical Path, Virtual Path or Relative Virtual Path.

"../" //the parent directory
"/" //the site root directory

I understood information such as. But I still don't understand the necessity of using "~/". I'm still working on small projects on my own computer. I haven't worked on the server side yet, maybe that's why I'm having difficulty understanding it. If I use "/" instead of "~/", I give the root directory and the file path works.

In the training videos I have watched, "~/" is used, but the reason for this is not explained.

Why do we have to use "~/"? I think it is a necessary condition on the server side, but I don't fully understand it.

Again, sorry if it's a simple question. I haven't worked on the server side yet.

Thanks.

Solution

  • No, it's nothing to do with your Unix ~ home directory - it's for a very Microsoft IIS-specific purpose (though Apache web-servers did use ~ for that, but that's another story).

    In ASP.NET, using ~/ as the start of a URI path means the path is application-root-relative - so like a /foo/bar website-root-relative path, but it allows the entire web-application to be lift-and-shifted to an apparent subdirectory and things like inter-page links will still work correctly.

    In more detail:

    It's because ASP.NET Core, and ASP.NET MVC, and ASP.NET WebForms going right back to 2001, all share a pretty neat feature: when ~/ is used correctly it means the web-application can "live" under an arbitrary subdirectory (or even deeper), in a special-kind of virtual-directory of an IIS website called an Application Scope which allows them to co-exist with other web-applications without treading on each others' toes.

    This was important back in the ye olden days when commodity infrastructure-as-code and spinning-up-new-VMs-and-containers-in-seconds was something only IBM Big Iron could do for legacy banks.

    This is still documented in the cold and drafty parts of Microsoft's documentation website.

    For example, let's pretend it's 2003 again and you're running IT for a small-ish company and you only have 1 IIS Website to work with, but you need to host 3 separate ASP.NET web-applications: a photo-gallery, some internal finance app, and some static pages.

    Because they need to share a single website, you decide to put them under /photos, /finance, and / respectively. So then you'd open up your website's web-space (i.e. its filesystem) at C:\Inetpub\wwwroot\, do mkdir photos && mkdir finance and then xcopy-deploy those files to those subdirectories and then configure those /photos and /finance directories as the root of two new Application Scopes in IIS Manager.

    ...that's what the Gear icon (instead of a folder icon) signifies in IIS 6 Manager:

    enter image description here

    Nnow because the Photos App and Finance App are ASP.NET WebForms Web-applications it means they both have /bin directories, but the /bin directory normally goes in the website root - well, no: actually the /bin goers in the root of the application's scope (and a website's root is its own root application scope), so instead of /photos and /finance having to share C:\Inetpub\wwwroot\bin\, they each get their own: C:\Inetpub\wwwroot\photos\bin and C:\Inetpub\wwwroot\finance\bin

    ...not only will they not be forced to share a /bin directory, but they won't even be sharing the same web-server host-process: separate applications are typically configured to run in different w3wp.exe processes so if once crashes it won't bring down anything else running in the same website.