What do the "/" and "~" signs mean in file path usage?

Yalçın Mete 60 Reputation points
2024-06-15T11:01:15.27+00:00

Hi,

If you allow, I would like to ask a question.

I want to access "b5.jpg" in CoreBlogTema from About/Index.

Which one should I start with "/", "./", "../", "~/" in the file extension?

Can you explain what these signs mean?

User's image

User's image

User's image

User's image

User's image

User's image

Thanks

ASP.NET Core
ASP.NET Core
A set of technologies in the .NET Framework for building web applications and XML web services.
4,338 questions
C#
C#
An object-oriented and type-safe programming language that has its roots in the C family of languages and includes support for component-oriented programming.
10,561 questions
{count} votes

Accepted answer
  1. AgaveJoe 27,421 Reputation points
    2024-06-15T21:01:29.58+00:00

    When I read the documentation, am I supposed to understand that the "~/" sign is a necessary addition on the server side?

    The "~/" is a server side construct and a convenient way to render a route relative to the application root.

    The slash "/" is a relative reference which tells the browser to start at the application root.

    https://www.w3schools.com/html/html_filepaths.asp

    The "~/" causes the Razor View to render relative reference back to the browser. For that to work, the request must pass through the ASP.NET Core MVC application. The URL must map to a controller (route) and the controller returns a Razor view (cshtml). The Razor engine is responsible for converting the "~/" to a relative reference for the browser.

    https://video2.skills-academy.com/en-us/aspnet/web-pages/overview/getting-started/introducing-razor-syntax-c#working-with-file-and-folder-paths-in-code

    The html files cannot use the "~" because the html files are returned by the static file handler. The html files do not pass through the Razor rendering engine.

    https://video2.skills-academy.com/en-us/aspnet/core/fundamentals/static-files?view=aspnetcore-8.0

    1 person found this answer helpful.

2 additional answers

Sort by: Most helpful
  1. SurferOnWww 2,326 Reputation points
    2024-06-15T12:40:45.68+00:00

    What do the "/" and "~" signs mean in file path usage?

    See the following Microsoft document:

    ASP.NET Web Site Paths


  2. Bruce (SqlWork.com) 60,201 Reputation points
    2024-06-16T03:01:42.13+00:00

    the url paths are modeled after the unix filesystem.

    • ./ = current folder (same as no prefix)
    • / = root folder. if the <base href> is not set it back to the domain name
    • ~/ = this is home folder in unix. in asp.net if the url preprocessed by the server, the ~/ is replaced with a path the application root. if not preprocessed, then typically its an invalid url.

    take the url "https://localhost/myapp/index.html" and no <base href> set. the browser will consider the base path to be "/myapp". so

    • "logo.jpeg" -> /myapp/logo.jpeg
    • "./logo.jpeg" -> /myapp/logo.jpeg
    • "../images/logo.jpeg" -> /images/logo.jpeg
    • "/images/logo.jpeg" -> /images/logo.jpeg
    • "~/images/logo.jpeg" -> /myapp/images/logo.jpeg (due to server rendering it)

    the browser supports a <base href=""> tag. this set the default path all relative paths are based on. so if for url "https://localhost/myapp/index.html" then its:

    • "logo.jpeg" -> /myapp/logo.jpeg
    • "./logo.jpeg" -> /myapp/logo.jpeg
    • "../images/logo.jpeg" -> /images/logo.jpeg
    • "/images/logo.jpeg" -> /myapp/images/logo.jpeg
    • "~/images/logo.jpeg" -> /myapp/myapp/images/logo.jpeg (because the server renders /myapp/images/logo.jpeg, but the browser prepends /myapp. don;t use "~" if setting base href