Remove query string in url when user reloads page

Question

Hi I have am logging in users and redirecting them to http://domain.com/profile/#welcomemessage or http://domain.com/profile/?msg=showwelcomemessage

So basically it shows welcome message based on query string.When Users reload the page I want to remove the query.i.e..basically I want to show the welcome message only once.

If this is not possible.Should I use localstorage ? will this work on all browsers?

Answer 1

You are probably looking for

window.history.replaceState

Usage:

window.history.replaceState( {} , 'foo', '/foo' );

From w3.org:

history . replaceState(data, title [, url ] )

Updates the current entry in the session history to have the given data, title, and, if provided and not null, URL.

or you can use localStorage like this:

if (!localStorage.getItem("visited")) {
 //yourmessage
 localStorage.setItem("visited", "true");
}
//clear the localStorage when the tab is closed
window.onbeforeunload = function() {
 localStorage.removeItem("visited");
};

Answer 2

localStorage sounds like the way to go. Or a session if you are more server-orientated. localStorage does work in ie8 and above

For localStorage:

if (!localStorage.hideWelcomeMessage) {
 document.getElementById('welcome-message').style.display="block";
 localStorage.hideWelcomeMessage = true;
}

and html:

<div id="welcome-message" style="display:none;">Welcome!</div>

The above assumes the id is "welcome-message" but of course you can change that up.