Question

我在IE中看到一个奇怪的错误，我在Chrome中看不到。具体来说，这涉及一些JS代码在（Telerik）向导导航回到它的第一步时不会触发。

当用户点击“上一步”按钮时，某些数据未正确加载。点击F12并启动开发者控制台向我展示了以下警告：

DOM7011：此页面上的代码禁用了前后缓存。有关详细信息，请参阅：http://go.microsoft.com/fwlink/?LinkID=291337

好的，所以我转到提供的链接，我注意到文档说明：

In order to be cached, webpages must meet these conditions:
...
 - The F12 Developer tools window isn't open

这是一个问题，因为当我使用向导中的导航按钮时，开启窗口打开时，它的行为正常，就像在Chrome中一样。

如何调试我的相关Javascript以便我可以弄清楚发生了什么？此外，我了解缓存是什么，但我不确定这是什么，我不知道为什么Chrome的行为不同。有没有办法可以强迫IE表现得像Chrome一样，并切断（或关闭）导致此问题的任何功能？

Answer 1

呸。回到老学校为你调试。

如果不将整个浏览器放入Windows调试器，您几乎可以忘记设置断点。您所能做的就是记录。

如果您很幸运并且您的问题不是太深，您可以使用简单的alert()语句来让您了解代码中各个阶段的状态。一个好处是你可以很好地序列化对象;例如，您可以执行JSON.stringify(this)，这可能会为您提供一个巨大的输出，您可以将其复制并粘贴到IDE中并解压缩。这样做的一个主要好处是警报会阻止，因此您可以花时间研究输出。这方面的一个主要缺点是竞争条件现在更有可能。

或者，您可以在页面中添加<textarea>并将JSON.stringify(this)结果输入其中。因为这意味着额外的DOM突变，它也增加了竞争条件的可能性，但不是很多。（如果有竞争条件，你可以这样做：

(function () {
    var currentState = JSON.stringify(this);
    setTimeout(function () {
        document.querySelector('textarea').value = currentState;
    }, 1000);
})()

即使这些现在是异步的，如果你按顺序多次使用它们，它们将以相同的顺序执行（除非你改变超时时间）。

如果您正在进行实际页面导航（而不仅仅是使用pushState()更改URL），那么实际读取这些日志将是一个问题。解决方案是将页面放在框架中并将内容写入兄弟框架。只要两个帧都在同一个域上运行，您就可以将数据推送到同级帧中。如果你不能把它们放在同一个域上，那你就有点搞砸了。

如何在IE中调试“返回导航缓存”？

1 个答案: