syntax - Javascript history.PushState not working?

Question

I have this code here:

<script type="text/javascript">
function goFunction(){
  history.pushState("google.ca", "GOOGLE CANADA", "http://www.google.ca");
  return event.preventDefault();
}
</script>

and

<a href="#" onclick="javascript:goFunction();">GO</a>

when I click on my link, I get this error in my error log:

 Uncaught SecurityError: A history state object with URL 'http://www.google.ca/' cannot be created in a document with origin 'http://cowelllaserhair.com'. 

you can see this at: http://cowelllaserhair.com/test.html

What am I doing wrong?

Do I need to reference something?

Thanks, J

Answer 1

The URL argument to pushState should be relative to the current page, or or an absolute URL in your own domain. You can't push state cross-domain - it would be a major security flaw.

The MDN documentation says:

The new history entry's URL is given by this parameter. Note that the browser won't attempt to load this URL after a call to pushState(), but it might attempt to load the URL later, for instance after the user restarts her browser. The new URL does not need to be absolute; if it's relative, it's resolved relative to the current URL. The new URL must be of the same origin as the current URL; otherwise, pushState() will throw an exception. This parameter is optional; if it isn't specified, it's set to the document's current URL.

The URL parameter is most commonly left blank or set a relative URL on your own site, like #/hello.