Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

replaceState(): a history state with url ... cannot be created in a document with origin

I have window.history.replaceState(null, null, 'about'); in main.js which are located in required/javascripts on my server.

Then on the about page (located in / (root) on my server), I have a link that uses window.history.replaceState(null, null, 'about:me'); on this page. Everything works fine, but when I click on another link with the same function but with about:girlfriend as URL, I'm getting this error message:

Uncaught SecurityError: Failed to execute 'pushState' on 'History': A history state object with URL 'about:girlfriend' cannot be created in a document with origin 'http://my.domain.com'.

I don't know why my browser (latest version of Chrome) think I'm trying to reach this page using pushState and I don't know why I'm getting this error message, no matter how many times I've read it. Can someone please explain this for me? I do not use History.js for this.

Worth mention, is that I'm not getting this error message if I change : to something else, like - or /. I want to use : because / is not working (404 Page Not Found) and - doesn't fit in - it's better with :.

like image 989
Airikr Avatar asked Sep 08 '14 11:09

Airikr


People also ask

What is history replaceState?

replaceState() The History. replaceState() method modifies the current history entry, replacing it with the state object and URL passed in the method parameters. This method is particularly useful when you want to update the state object or URL of the current history entry in response to some user action.

What is the difference between pushState and replaceState?

The big difference is, that while pushState will create a new entry in the browser's history, replaceState will only replace the current state. As a side effect of this, using the replaceState method will change the URL in the address bar, without creating a new history entry.

What is state pushState history?

state. The state object is a JavaScript object which is associated with the new history entry created by pushState() . Whenever the user navigates to the new state , a popstate event is fired, and the state property of the event contains a copy of the history entry's state object.


1 Answers

If you are trying to do this locally, the following works for both locally and remote loaded pages:

history.replaceState(null,null, window.location.pathname + "your thing here")
like image 104
user5258091 Avatar answered Oct 02 '22 00:10

user5258091