Menu
I have found numerous answers on how to extract the URL without the parameters.
How do you rewrite the URL in the address bar without causing the page to reload with the new URL?
shortURL = top.location.href.substring(0, top.location.href.indexOf('?'));
top.location.href = shortURL // Causes redirect
The goal is to extract the parameters in Javascript but not display them in the address bar.
544
Method 2: Adding a new state with pushState() Method: The pushState() method is used to add a new history entry with the properties passed as parameters. This will change the current URL to the new state given without reloading the page.
URL parameters are made of a key and a value, separated by an equal sign (=). Multiple parameters are each then separated by an ampersand (&).
In modern browsers with support for the History object, you can use either history.replaceState() or history.pushState() to change the current URL without changing the current page. There are limitations on what you can change (for example, you cannot change the domain/origin this way for security reasons).
See here for a summary of these methods.
The browser history is a recording of where you have been in your browsing session. .replaceState() allows you to replace the current item in the history list with a different one. .pushState() adds a new item to the browser history and both change the URL displayed in the browser URL bar without reloading the page. You select which method to use depending upon how you want the browser's "back" button to behave for this particular page entry.
Note: These APIs are supported in IE 10 and later.
In older browser versions without support for the history API, the only part of the URL you can change without reloading the page is the hash tag (the part after a # symbol) at the end of the URL.
114
In html5, rewriting url without reloading the page is possible (still you can not change the domain name for security reasons), using history api you can write:
history.replaceState("object or string", "title", "/another-new-url");
in which the first two parameters are somehow arbitrary, and the third parameter is the new url (not including domain name). If you want to enable back button for returning to previous url, use pushState instead of replaceState above. Read more about these functions in this blog post.
Regarding browser support, it is supported in recent Firefox and Chrome versions, but only in IE10+, which is not very common yet. For details see compatibility matrix or browser implementation details.
24
You can't change the value in the address bar without redirecting. That would be a phishing scammer's dream come true!
You can, however, change the fragment identifier: (in JavaScript, the window.location.hash value)
<!DOCTYPE html>
<html>
<head>
<title>This is a test</title>
<script>
window.onload = function() {
window.location.hash = "Loaded!";
document.getElementById("click-me").onclick = function() {
window.location.hash = "Click!";
document.getElementById("click-me").onclick = function() {
window.location.hash = "Clicked AGAIN!";
};
};
}
</script>
<body>
<div>
<input type="button" id="click-me" value="click me!" />
</div>
</body>
</html>
But changing the query string will redirect the page.
45
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
