[Solved] Prevent user from copying URL from address bar [closed]

Question

you can use history.pushState() to set the url bar to something that doesn’t give away secrets. for example, run this in the console:

 history.pushState(null, null, "https://stackoverflow.com/");

After running, it now looks like you’re on the stack home page, even though you are still on /questions/26537657/prevent-user-from-copying-url-from-address-bar/. it won’t stop hackers, but it will prevent naive users from spilling the beans. you can use this to compose vanity urls as well as short ones. just make sure the server knows what to do with any url you generate because when you return via that url, it uses the server, and thus it will need to produce something meaningful.

edit: as kindly pointed out in comments, history.pushState() create a new history entry. this might not be what you want if this page will papear mid-workflow, as opposed to a popup or other end destination. Uf that’s the case, you should use it’s non-creating counterpart:

 history.replaceState(null, null, "https://stackoverflow.com/");

That will just replace your current url in the address bar, without creating a new entry, so that back goes back.

There seems to be some confusion about pushState’s implications on security. there is no such thing in client-side code. It bears repeating: “this won’t stop hackers”, it will just provides shorter bookmark-able URL to your users and prevent them from worrying the IT dept, regardless of the merits of IT’s discomfort.

Accepted Answer

you can use history.pushState() to set the url bar to something that doesn’t give away secrets. for example, run this in the console:

 history.pushState(null, null, "https://stackoverflow.com/");

After running, it now looks like you’re on the stack home page, even though you are still on /questions/26537657/prevent-user-from-copying-url-from-address-bar/. it won’t stop hackers, but it will prevent naive users from spilling the beans. you can use this to compose vanity urls as well as short ones. just make sure the server knows what to do with any url you generate because when you return via that url, it uses the server, and thus it will need to produce something meaningful.

edit: as kindly pointed out in comments, history.pushState() create a new history entry. this might not be what you want if this page will papear mid-workflow, as opposed to a popup or other end destination. Uf that’s the case, you should use it’s non-creating counterpart:

 history.replaceState(null, null, "https://stackoverflow.com/");

That will just replace your current url in the address bar, without creating a new entry, so that back goes back.

There seems to be some confusion about pushState’s implications on security. there is no such thing in client-side code. It bears repeating: “this won’t stop hackers”, it will just provides shorter bookmark-able URL to your users and prevent them from worrying the IT dept, regardless of the merits of IT’s discomfort.