Safari 停止加载答案

【问题标题】：Safari stops loadingSafari 停止加载
【发布时间】：2012-10-13 21:57:30
【问题描述】：

我正在处理的网站似乎随机停止加载页面（仅显示白色页面）和图像（仅显示蓝色问号，但占位符已在正确的尺寸中）。

这样做时，它会在网络检查器中显示“状态 403，未修改”消息。在这是一个页面的情况下，它只加载了几个字节，我无法从开发人员菜单中选择“显示源”。当我点击“重新加载”时，页面会立即出现，就好像已经被缓存了一样。这也发生在我清除缓存并且错误出现在我尝试加载的第一页之后。

通常当我在页面尚未完成加载时单击链接时会发生这种情况。在时间轴中，我看到虽然 url 已经设置为新页面，但 Safari 仍在从旧页面加载各种内容，并且在最终尝试加载新页面时有点超时。

如果图像显示不正确，则表明它们已加载（“资源”概述中没有显示错误）。此外，重新加载后，一切都在那里。

我用谷歌搜索了很多，似乎很多人多年来一直在使用 Safari 和图像未完全加载或页面显示为空白页时遇到问题。尽管如此，这些问题和投诉中提到的网站在我的 Safari 上显示良好（Ebay 被提及很多，以及谷歌图片）。

我尝试了许多不同的方法，例如预加载、延迟加载（在应该显示图像时将 src 设置为 data-src）、重新加载（在显示图像后将 src 设置为自身）。此外，当我在 Safari 开发人员菜单中打开缓存时，它似乎没有任何区别。我没有尝试 Apple 论坛上提供的任何 DNS 解决方案，因为我想在代码端解决这个问题。

当您查看我的 js 时，您会发现正在进行一些调整大小和延迟加载。即使我关闭所有这些东西，问题仍然存在。我意识到图像非常重（几乎所有图像都超过 500kb）——我仍然希望无论图像大小如何都能找到解决方案，因为我将来无法完全控制内容。

页面： http://www.alique.nl/archive 您必须单击缩略图并浏览图像以查看错误。由于它发生在随机页面上（至少看似），我无法指向更具体的页面。

这是js文件： http://www.alique.nl/js/lib.js

【问题讨论】：

不稳定的结果通常是网络问题而不是javascript问题。但是，对于这种情况，脚本可能没有足够的错误处理。
我想过——尽管图像可能是这种情况，但对于“白页”来说这是不可能的，因为 Safari 从来没有进入脚本（在页脚中）。加载的几个字节强烈地向我表明了一些“令人头疼”的东西。我在 Apple 论坛上找到了这个帖子：discussions.apple.com/thread/4151483?start=30&tstart=0 有没有人安装过与 Safari 加载问题相关的 OS X 10.8.2（因为我还没有安装）？

标签： javascript safari

【解决方案1】：

当服务器返回304 Not Modified 状态时，似乎在 Safari 中指定了错误的 mime 类型 (text/plain)（请参阅 Web Inspector）。这会阻止图像正确显示。在 Mac 和 Windows 中都会发生（在 Chrome 中似乎没有发生）。但我无法重现空白页。

一种可能的解决方案可能是在您的.htaccess 文件中明确定义图像的mime 类型：

# Force correct mime-types
AddType image/gif .gif .GIF 
AddType image/jpeg .jpeg .jpg .jpe .JPG

可以在http://www.htaccess-guide.com/adding-mime-types/ 找到完整的 mime 类型列表。但是，这可能不起作用，因为这可能是 Safari 中的一个错误，因为原始内容是使用正确的 mime 类型提供的。

一种解决方法，但相当简单的解决方案是完全禁用缓存，再次在.htaccess：

# Disable caching of resources in user-agent:
FileETag None
<ifModule mod_headers.c>
  Header unset ETag
  Header unset Last-Modified
  Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
  Header set Pragma "no-cache"
  Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</ifModule>

或者在 PHP 中：

// Disable caching of resources in user-agent:
header('ETag: ' . md5(time()) ); 
header("Expires: Wed, 11 Jan 1984 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

这可能与这个问题有关：Debug message "Resource interpreted as other but transferred with MIME type application/javascript"

【讨论】：

它确实会影响错误 - 在我测试过的一些计算机上，白页错误消失了，图像似乎加载得更好。在其他计算机上，之前完美加载的图像（如徽标）突然停止加载。现在我正在预加载 document.ready 页面上的所有图像。我在我的 .htaccess 中强制使用 MIME 类型。 Safari 中的问题仍然存在。

【解决方案2】：

我通过删除用于合并所有 .css 和 .js 文件的合并脚本解决了这个问题： http://rakaz.nl/projects/combine/combine.phps

我不知道为什么这解决了它 - 我没有对任何 .css 或 .js 文件本身进行任何更改。基本上，combine 脚本只是将所有文件一起粘贴到 1 个大的新文件中，并且不会向现有文件添加任何新内容。

错误如此随机地发生对我来说也没有什么意义：并非每次安装 Safari 时，也不总是在相同的页面或相同的图片上。关闭 .htaccess 中的缓存确实改变了一些东西（它使它可以在更多计算机上工作，但不是全部），但影响了以前没有遇到问题的其他图像（比如徽标，它不会加载随机页面）。

似乎缓存和 Safari 肯定存在一个奇怪的问题。对于任何来到这里遇到类似问题的人，我建议关闭任何与缓存有关的东西（比如 gzip 和类似的东西），以找出导致问题的原因。

【讨论】：