如何在实时网站上强制背景图像刷新？

Question

我正在尝试更改实时网站的背景图片，但图片不刷新。

body{ 
 background-image:url('/img/bg.jpg');
}

如何强制重新加载背景图片？

Answer 1

浏览器可能正在缓存图像，而不是尝试再次请求它。 您可以向图像 url 添加一个查询字符串 - 这通常会告诉浏览器再次获取图像：

body{ 
 background-image:url('/img/bg.jpg?v=2');
}

请记住，它只会在您第一次使用查询字符串请求图像时起作用。第二次它已经被缓存了。 当您想要强制客户端在您知道某个图像发生变化时刷新它时，此策略非常有用。

如果您想每次都刷新图像（我不明白您为什么要这样做），您可以生成一个随机字符串并将其附加到查询字符串中。由于您无法使用 CSS 生成字符串，因此您可以使用 javascript 生成字符串并将内联样式应用于元素（在您的情况下为 body 元素）。