Clear html history created by pushState on refresh

Question

I have array of states and index of the array in history.state and on popstate I read the content of the array, it work fine but when I go back to first page and refresh the array is gone (which is normal) but forward history state remain.

Is it possilbe to remove fake history that was created using pushState?

I can't store my state in localStorage because I have functions in my state array.

You could set a new state using pushState or replaceState on pageload, it will remove the forward history. — sergiogarciadev, May 21 '14 at 12:16

score 12 · Accepted Answer · answered May 21 '14 at 12:16

12

If you read the specification of History API for pushState, in step 4 it states

If the method invoked was the pushState() method:
Remove all the entries in the browsing context's session history after the current entry. If the current entry is the last entry in the session history, then no entries are removed.

So depending on what you are trying to do, you could make a special case for when first loading the page and push a state (one you will consider your first), and in doing so clear the forward states of the history.

answered May 21 '14 at 12:16

Gabriele Petrioli

173,972
30
239
291

3

Almost work, but when I create pushState onInit (refresh) I've got two pages in history, original real page and fake one from pushState. replaceState also don't work because it don't clear the history only change current one. It's not perfect, but probably you can't do any better. – jcubic May 24 '14 at 14:10

score 5 · Answer 2 · answered Aug 05 '16 at 13:13

5

My idea - override whole history:

for (i = 0; i < 50; i++) {
  history.pushState({}, '');
}

answered Aug 05 '16 at 13:13

Luke Duda

790
8
11

4

For what it's worth, my virus scan prevented this due to "history injection", so it might not work on all clients. – JustinKSU Dec 07 '18 at 18:58

score 3 · Answer 3 · answered May 21 '14 at 12:32

There is no way to clear the session history or to disable the back/forward navigation from unprivileged code. The closest available solution is the location.replace() method, which replaces the current item of the session history with the provided URL. Mozilla

The only way is this (but I think you know it)

var length=history.length;     
history.go(-length);
window.location.replace("urlToRedirect");

after using replace() the current page will not be saved in session history, meaning the user won't be able to use the Back button to navigate to it.

However, the user can go forward, because replace will not remove history ahead. — Martin Braun, Aug 23 '17 at 13:39

score -1 · Answer 4 · answered Jan 16 '20 at 14:45

-1

window.history.replaceState('page', '');

this code on page load will prevent a double back button

answered Jan 16 '20 at 14:45

user1885464

1
1

This don't answer the question, this just replace last url. not clear history. Read first and only comment. – jcubic Jan 17 '20 at 23:32

Clear html history created by pushState on refresh

4 Answers4