ignoreQueryPrefix should also ignore # character

[mjhoffm2]

I would like to be able to parse location.hash like this module does: https://www.npmjs.com/package/query-string

Currently, only the ? character is ignored when the ignoreQueryPrefix option is set.

[ljharb]

In general, abusing the hash for a query string is a really bad idea - pages should either redirect (iow, in IE <= 8), or use pushState.

What's your use case?

[mjhoffm2]

I have a web app with some state that I would like to persist in the url. This generally consists of 2 or 3 variables which can be easily represented as a query string. Putting it in the hash allows the urls to be bookmarkable, and lets me easily update those variables when the forward/back buttons on the browser are pressed. I am indeed using pushState/replaceState.

Additionally, I am upgrading a website that used dojo/hash and dojo/io-query to do exactly this, and would like to be able to keep the same urls as before.

[ljharb]

If this were to be added, it'd need a separate option - ignoreAnchorPrefix or similar.

For the moment, qs.parse(location.hash.slice(1)) seems simple enough?

[mjhoffm2]

The way I have my code set up, the query string that I need parsed may or may not include the hash character, so I have a helper function to check and remove the prefix.

However, I really like your suggestion of using String.slice(1) whenever I am reading directly from location.hash. It also works when the hash is an empty string. Thanks for the suggestion.

[ljharb]

I'll leave it open in case others have the same request and can supply use cases.

[Noitidart]

I agree that hash should not be used. But facebook oauth uses the hash. It returns something like this:

http://127.0.0.1/nativeshot_facebook?#access_token=EAARM8nQ1sQoBAIawaVlx2kwi3rIWEhdMsGIcnKRXhkybKtTMeZAPKtzhlVYqgtgdCS5Xh8FPevwGi1YhK6bsH6QIFGh2sgC5z9oBUjZBPvsZAUeImMkheTxgfDmHh7BUADpKVeNbxqrv9DFYs4GbVYZA1GL0TWZBPYqgLD0JItwJNHC2kindmT&expires_in=4412

The slice(1) is good. Just sharing that someone huge like facebook abuses hash like this, and that queryString lib does support ignoring first prefix - https://www.npmjs.com/package/query-string

[Noitidart]

Oh wow google and dropbox also does this when redirect_uri on their oauth settings is localhost:

Google:

http://127.0.0.1/nativeshot_gdrive#access_token=ya29.CjAfA1nxnnVzvfu9fSXT2yvQD_sJFO8yo8yD7szlFyVJGupHVGQzuDcTvSoKOq95FH0&token_type=Bearer&expires_in=3600

Dropbox:

http://127.0.0.1/nativeshot_dropbox#access_token=ftYMGdX8484kAAAAAAABaJCVcre58PvMTJMuxaF0isXV8i-T2jIXCqqrk6BMVBaS&token_type=bearer&uid=274747188&account_id=dbidaaA333veNl-2S9PQnARyLb6Kv97pakP9h6LBpU

[ljharb]

It’s not relevant who does a bad thing; the reputation of specific companies can’t possibly change that a bad thing is bad.

[Noitidart]

Agreed. Just sharing.

[shri3k]

@Noitidart it really isn't abusing hash. In fact, it's the correct implementation because you're probably requesting implicit grant type and the callback url with query params would mean it'd be part of the request however hash are usually for browsers only.

[Noitidart]

Interesting thanks @shri3k

I also found that urijs module - https://www.npmjs.com/package/urijs - gives us .fragment, and .search and .query. and .hash to give us exactly what we want. Doing a parseQuery on to get it into an object:

import URI from 'urijs'

    const uri = new URI(url);
    const fragment = URI.parseQuery(uri.fragment());
    const query = URI.parseQuery(uri.query());

I ended up having to use urijs because a bunch of oauth services, (facebook, google, etc) are using hash fragment.