How to Get the Fragment Identifier (Value After Hash #) from a Url

How do I get the fragment identifier (value after hash #) from a URL?

No need for jQuery

var type = window.location.hash.substr(1);

Since String.prototype.substr is deprecated use substring instead.

var type = window.location.hash.substring(1);

Get fragment (value after hash '#') from a URL

If you want to get the value after the hash mark or anchor as shown in a user's browser: This isn't possible with "standard" HTTP as this value is never sent to the server (hence it won't be available in $_SERVER["REQUEST_URI"] or similar predefined variables). You would need some sort of JavaScript magic on the client side, e.g. to include this value as a POST parameter.

If it's only about parsing a known URL from whatever source, the answer by mck89 is perfectly fine though.

Parsing URL hash/fragment identifier with JavaScript

Check out: jQuery BBQ

jQuery BBQ is designed for parsing things from the url (query string or fragment), and goes a bit farther to simplify fragment-based history. This is the jQuery plugin Yarin was looking for before he put together a pure js solution. Specifically, the deparam.fragment() function does the job. Have a look!

(The support site I'm working on uses an asynchronous search, and because BBQ makes it trivial to tuck entire objects into the fragment I use it to 'persist' my search parameters. This gives my users history states for their searches, and also allows them to bookmark useful searches. Best of all, when QA finds a search defect they can link straight to the problematic results!)

How to get the #fragment identifier part of an URL

The fragment is not available on the server side.

From RFC2396

When a URI reference is used to perform a retrieval action on the identified resource, the optional fragment identifier, separated from the URI by a crosshatch ("#") character, consists of additional reference information to be interpreted by the user agent after the retrieval action has been successfully completed. As such, it is not part of a URI, but is often used in conjunction with a URI.

You can access it in JavaScript with window.location.hash.

Get URL fragment identifier with Flask

The hash of the URL (everything after the #) is never sent to the server, the browser will strip it away, keeping that part of the URL completely client-side. According to Wikipedia:

The fragment identifier functions differently to the rest of the URI: its processing is exclusively client-side with no participation from the web server, [...]. When an agent (such as a Web browser) requests a web resource from a Web server, the agent sends the URI to the server, but does not send the fragment.

This means there's no way to retrieve it on the backend, no matter which framework you use, as none of them will ever receive that piece of data.

You need to use query parameters instead, so your URL should look like this:

https://foo.com/bar?data1=ABC&data2=XYZ

And in this case, you will be able to access them using request.args:

from flask import request

@app.route('/bar')
def bar():
    page = request.args.get('data1', default = '', type = str)
    filter = request.args.get('data2', default = 0, type = int)

Getting URL hash location, and using it in jQuery

Editor's note: the approach below has serious security implications and, depending upon the version of jQuery you are using, may expose your users to XSS attacks. For more detail, see the discussion of the possible attack in the comments on this answer or this explanation on Security Stack Exchange.

You can use the location.hash property to grab the hash of the current page:

var hash = window.location.hash;
$('ul'+hash+':first').show();

Note that this property already contains the # symbol at the beginning.

Actually you don't need the :first pseudo-selector since you are using the ID selector, is assumed that IDs are unique within the DOM.

In case you want to get the hash from an URL string, you can use the String.substring method:

var url = "http://example.com/file.htm#foo";
var hash = url.substring(url.indexOf('#')); // '#foo'

Advice: Be aware that the user can change the hash as he wants, injecting anything to your selector, you should check the hash before using it.

How can I get fragment value from server side?

You can't.

There is a big difference between hash (#) and query string (?). The query string is send to the server, the hash isn't.

So the url send to the server is: http://localhost:4567/Test/Callback.

The only option you have to get the 'hash' to the server is by using a query string:

http://localhost:4567/Test/Callback?state=test&access_token=...