I realized that many of web app use # in their app’s URL.
For example, Google Analytics.
This address is in the URL bar when I am viewing the visitor’s language page:
https://www.google.com/analytics/web/?hl=en#report/visitors-language/a33185827w60383872p61754588/
This address is in the address bar when I am viewing the visitors’ geolocation page:
https://www.google.com/analytics/web/?hl=en#report/visitors-geo/a33185827w60383872p61754588/
I think that this is the Google Analytics web app passing #report/visitors-language and #report/vistiors-geo.
I know that Google analytics is using an <iframe>. It seems that only the main content box is changing when displaying content.
Is # used because of the <iframe> functionality?
There are several answers but none cover the backend part.
Here is a URL, one from your own example:
You can think about the post-hash (including the hash
#) part as a client-side request.The web server will never know what was entered after the hash sign. It is the browser pointing to a specific ID on the page.
For basic web pages, if you have this HTML:
<a name="main">welcome</a>on a web page at
www.example.com/welcome, going towww.example.com/welcome#mainwill scroll your browser viewport to the welcome text in the<a>HTML tag.The web server will not know whether
#mainwas in the URL or not.Values in the URL after a question mark are called URL parameters, e.g.
www.example.com/?foo=bar. The web server can deliver different content based on those values.However, there is a technology developed by Google called AJAX (Asynchronous JavaScript and XML) that makes use of the
#part in the URL to deliver different content without a page load. It’s not using an<iframe>.Using JavaScript, you can trigger a change in the URL’s post-hash part and make a request to the server to get a specific part of the page, for example for the URL
www.example.com/welcome#main2Even if an element named#main2does not exist, you can show one using JavaScript.A hashbang is
#!. It is used to make search engine indexing easier by indicating that this part is a dynamic web page.