19

我们在工作中遇到了一个仅在 chrome 中发生的奇怪问题。看起来 css 文件正在被缓存，并且该文件的内容没有被重新下载。

问题是，当使用新会话（例如“私人会话”）时，图像“mainSprite.png”没有显示出来。

经过一些测试，我认为问题与我们在用户未通过身份验证的情况下在开始时进行重定向有关。据我了解，它可能无法完成css文件中链接的精灵的下载。一旦重定向开始，它将缓存一个无效对象，然后在接下来的页面上，它将无法显示正确的图像，因为它缓存了一些错误的东西。

奇怪的是，它实际上在某个时候完全加载了图像。但它看起来并没有在记忆中刷新它......

在第一次加载和图像正确显示时开始重定向之前，我做了一秒钟的超时。这是一个快速修复，我不能指望每台计算机在 1 秒内加载 css 中包含的每个图像。

编辑

据我所知，它看起来真的像一个比赛条件。我改变了加载顺序。我们使用 require.js。我没有在css之后加载js，而是在之前开始加载js。并且图像现在可以在我的本地服务器上正确加载。

如果有人有兴趣研究它：

http://api.checklist.com

编辑 2

当图像不可见时，打开新标签也会遇到同样的问题。关闭浏览器并重新打开它将在第一次加载时起作用，并且图像不会被下载而是从缓存加载，这意味着在关闭浏览器之前，图像确实已经下载。

4

6 回答 6

1

看起来问题来自您的重定向，不幸的是我看不到您的示例（链接无法打开）。Google chrome 确实存在缓存问题，这在开发期间很烦人（清除缓存，加载新图像，对新图像执行相同操作..），如果您需要清除缓存，请尝试以下操作：

试着去

chrome://chrome/settings/clearBrowserData

在您的 chrome 浏览器中并检查选项：

清空缓存（我还清除了下载历史记录和删除 cookie 以及其他站点和插件数据）

点击“清除浏览数据”按钮，它应该

于 2012-12-11T18:59:23.013 回答
0

首先，我建议您首先尝试找到缩小重定向范围的方法。如果可能的话，我建议尝试使用PHP或ASP等语言（仅举两例）根据您的用户身份验证动态创建您的内容会更加明智。

在网页上禁用缓存的经典方法是在<meta>标签内设置两个<head> </head>标签。但是，您应该注意，这些在技术上并不“正确”，因为它们不是任何“官方”标准文档的一部分。这也意味着我将再次倾向于我的第一个建议，即找到一个更好的交付系统，这反过来应该可以防止这个问题。

因此，出于“测试”目的，标签将是：

<HEAD>
    <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
    <META HTTP-EQUIV="EXPIRES" CONTENT="0">
</HEAD>
于 2012-09-27T18:57:35.033 回答
0

您需要做的就是通过 chrome 跟踪您的现金清单，据我所知，您收到了这个错误，导致它没有被缓存：

未捕获的类型错误：对象 [对象对象] 没有方法“占位符”

因此，如果您想跟踪，可以使用清单离线模式或通过代码进行跟踪。

只需关注并测试您的页面，我确实发现了错误所在：

文件：scripts2.js 第 20 行 --> $('input[placeholder]').placeholder();

您需要检查占位符的名称并在此标签中更改它。

谢谢

于 2012-09-07T00:22:10.127 回答
0

我假设您的服务器/后端应用程序已设置路由。喜欢这部剧！框架示例：

# Ignore favicon requests
GET     /favicon.ico                    404

# Map static resources from the /app/public folder to the /public path
GET     /public/                        staticDir:public

# Catch all
*       /{controller}                   {controller}.index

根据您的摘要，我建议根据需要在配置文件或 htaccess 中设置静态文件夹路由（图像所在的位置），然后在浏览器 url 栏中检查图像 url（带有空会话）。那应该工作！

于 2012-09-12T08:59:26.493 回答
0

也许我不明白你的问题或困境（可能是因为缺乏解释，或者因为我运行 Chrome 后我无法在该链接上看到你的页面），但我在这里遇到了一个示例，它仅使用Javascript/jQuery 加载，而不是 CSS：

http://jsfiddle.net/2Cgyg/6/

使用 URL 上的图像：http: //www.w3schools.com/cssref/img_tree.gif

虽然接受的答案在 Chrome 中对我不起作用，但这是我从上面得到的 jsFiddle 的问题，来自：

从 javascript 加载图像

所有的缓存等都是不必要的，甚至是如果您的图像更新为其他内容时您不想做的事情 - 它们不会在不强制刷新的情况下出现，您只能通过像这样更改文件名来完成为避免用户看不到您更新的图像：

myPic.jpg?MMDDYYYY

您可以根据修改日期来设置日期。

于 2014-08-12T23:51:59.660 回答
0

清理您的浏览器历史记录，如缓存、cookie 清理临时 Internet 文件

如果问题没有解决然后重新安装浏览器你的问题肯定解决了

于 2015-11-09T05:02:40.730 回答