Question

采用以下代码，并通过网络服务器（例如http-server（节点程序包）通过服务器提供代码。我在here上有一个示例服务器。

<meta http-equiv="Cache-Control" content="max-age=0"/>
<script>
window.onload = function() {
    document.write('<script>history.pushState(null, null, "bar.html");console.log("passed");\u003c/script>');
}
</script>

请注意，Cache-Control标头是存在的，因为IE由于某些原因会主动缓存页面。这在测试过程中对我有帮助，但不必重现该问题。

当我在IE11（Windows 10）中加载页面时，我得到SecurityError打印到控制台，没有URL更改，也没有打印“通过”。

在Edge 16中，我被“传递”到控制台，但没有URL更改。

在Firefox和Chrome中，此方法工作正常：URL更改并且我被“传递”到控制台。

为什么IE会这样运行，如何将document.write()与pushState()结合使用？我的意图是覆盖整个文档，而不是简单地附加到文档上（这就是为什么我使用window.onload）。

Answer 1

尝试在代码中添加Try ... Catch，然后尝试使用IE11进行测试。

<html>
<body>
<script>
try {
history.pushState(null, null,"bar.html");
console.log("passed");
}
catch(err) {
    document.getElementById("demo").innerHTML = err.message;
}
</script>
</body>
</html>

输出：

Answer 2

如果有人遇到相同的问题，则可以在IE11中解决此问题。

只需执行location.href = location.href + '#fix-ie'即可更改URL，而无需重新加载页面。必须在开始时就完成此操作，然后其他任何事情才有机会进行history.pushState或history.replaceState。

这似乎是将location.href“移动”到新文档中。

完整代码：

let original = location.href;
if (original.indexOf('#') === -1) {
    location.href = original + '#ie-fix';
    location.href = original + '#';
} else {
    location.href = original + 'ie-fix';
    location.href = original;
}

在由document.write（）创建的新文档中调用history.pushState（）会导致Internet Explorer 11上出现SecurityError

2 个答案: