3

我已经在这个 PHP CPU 和 RAM 监视器上工作了一段时间了 - http://nereus.rikkuness.net/php-cpu-monitor/

这一切都很好，并且做了它应该做的事情。但是我用的是Linux所以没有太多的能力在IE上测试。一些朋友说它适用于所有现代但完全崩溃的 IE。

只是想知道是否有人知道为什么会这样？

代码可在此处获得 - http://php-cpu-monitor.googlecode.com/files/php-cpu-monitor-1.0.tar.gz

4

3 回答 3

4

IE 在第一次加载时缓存您的 AJAX 调用。因此，您的间隔计时器被绕过，并且您的 UI 会因不断调用 replay() 函数而受到冲击

$("#cpu").load("cpu.php?cpu=" + cpuCall , function() {

您可以添加时间戳以避免获得缓存的结果：

$("#cpu").load("cpu.php?cpu=" + cpuCall + "&t=" + new Date().getTime(), function() {

检查此链接以供参考

jQuery 的 .load() 在 IE 中不起作用 - 但在 Firefox、Chrome 和 Safari 中很好

另一种解决方案可能是使用 setTimeout() 延迟对 replay() 的调用

setTimeout(replay,cpuCall);

但是，如果我正确理解您的代码，这将要求您在服务器端更改代码（并且它不会解决 IE 缓存问题）

于 2013-01-21T13:58:42.500 回答
4

过去我遇到过一些与此非常相似的问题，它们通常总是与缓存有关。而且由于您的 AJAX 请求被缓存，您的 PHP 脚本不再在用户给定的时间间隔内休眠，这就是为什么您看到请求完成得更快的原因。

缓存背景

实际上，您的 Web 服务器将发出三个响应标头来控制 AJAX 资源的缓存方式。这些适用于 HTTP 和 AJAX 请求。为了您的目的，您实际上并不需要了解这些，但了解这些信息总是很好的信息：

  1. Expires - 此标头告诉浏览器何时需要检索资源的新版本。例如，一张照片或公司徽标可能会将 Expires 标题设置为未来几个月，因为我们不希望这些图像经常更改。另一方面，检索对时间敏感的 CPU 使用数据的 AJAX 请求的 expires 值可能应该为 -1 以确保始终刷新此数据
  2. Last Modified - 浏览器可以使用它向服务器发送条件 GET 请求。服务器检查资源是否在给定值之后更改，如果是，则返回更新的内容
  3. 缓存控制- 这允许代理和其他缓存将此资源的副本存储在共享（或非共享）池中，以便更快地访问资源。

jQuery.load() 是如何工作的

jQuery.load() 通过向服务器上的 html 资源发送一个简单的 GET 请求来工作。请记住，jQueryload()函数是获取数据的最简单方法，而且通常不是数据检索的最佳方法。它旨在成为一种从服务器获取 html 并随后在您选择的 jQuery DOM 元素中填充 html 的快速方法。这是来自文档的片段：

此方法是从服务器获取数据的最简单方法。它大致相当于 $.get(url, data, success) ，只是它是一个方法而不是全局函数，并且它具有隐式回调函数。当检测到成功响应时（即当 textStatus 为“success”或“notmodified”时），.load() 将匹配元素的 HTML 内容设置为返回的数据。这意味着该方法的大多数使用都非常简单。

由于$.load()主要是一种将 html 插入 jQuery 元素的简单方法，因此 jQuery 库不提供确保您的请求不被缓存的机制。这是合理的，因为如果您只是检索 HTML，我们可以通过缓存这些响应来获得更高的性能，尤其是在它们没有更改并且被频繁轮询的情况下。

在我测试的所有浏览器中，看起来 IE(9) 是唯一一个始终缓存 AJAX 请求的浏览器。查看 Firefox 与 Internet Explorer 中发出的请求之间的区别：

火狐：

Firefox 中的 AJAX 请求

IE浏览器：

IE9 中的 AJAX 请求

请注意来自 IE 的可疑 <1 ms 响应时间。 IE 不会在过期日期之前刷新缓存的内容，也不会在缓存方面区分 HTTP 和 AJAX 请求。我们需要尝试不同的解决方案，以确保每次调用您的 AJAX URL 时都能接收到新数据。

防止 Internet Explorer 缓存 AJAX 请求

有几种不同的方法可以解决 IE 的缓存限制：

  1. 向查询字符串添加一个随机标记（nonce 值），例如?token=[timestamp]. 通过更改每个请求的请求 URL，浏览器将为每个请求存储不同的资源缓存副本，您将确保从服务器获取最新数据。jQuery 通过简单地获取时间戳来创建一个随机值，如下所示：var nonce = ( new Date() ).getTime();
  2. 使用 POST 而不是 GET 请求。由于 POST 请求旨在发送修改服务器上资源的请求，因此浏览器永远不会缓存它们。
  3. 发送一个专门禁止浏览器缓存它的 HTTP 响应标头- 这将在您的 cpu.php 中实现。您可以通过更改$http_response_header数组轻松地修改它（请参阅此处的文档）
  4. 使用jQuery.ajax()代替jQuery.load()：您可以使用该选项$.ajax()指定某些 AJAX 调用以强制刷新。cache: false甚至更多，您可以通过在 ajaxSetup(): 中进行配置来确保每次刷新所有 AJAX 调用$.ajaxSetup ({ cache: false });。这与#1 的解决方案基本相同，但无需在您的 javascript 代码中创建 nonce 值。

在所有备选方案中，#4 是最能保留您正在发出的请求类型并且最容易配置的选项。

另一个建议 - 使用window.setInterval()调用你的replay()函数是一种设置请求之间等待间隔的简单方法，并且通常在客户端上实现可变长度的睡眠周期比在服务器上更好。

于 2013-01-21T18:57:26.883 回答
-1

我看到这段代码，文本在输入标签之外，这是故意的吗？

<input id="radio01" type="radio" name="speed" value="0.1" onclick="changeSeconds(this)" />0.1
<input id="radio05" type="radio" name="speed" value="0.5" onclick="changeSeconds(this)" checked="checked" />0.5
<input id="radio1" type="radio" name="speed" value="1" onclick="changeSeconds(this)" />1
<input id="radio5" type="radio" name="speed" value="5" onclick="changeSeconds(this)" />5
<input id="radio10" type="radio" name="speed" value="10" onclick="changeSeconds(this)" />10
于 2013-01-03T08:37:26.437 回答