缓存的背景图片 [英] cache background image

问题描述

有没有一种方法，以缓存的背景图片。

Is there a way to "cache" background image.

例如..
背景图像3x3px，它的设置是这样的：

For example.. Background image is 3x3px and it's set like this:

body {
    background: #000 url(bg.png);
}

在刷新发生时，背景图片闪烁第二。

When refresh happens, background image "flickers" for second.

有一个跨浏览器的解决方案？ （为Apache / PHP服务器，如果这是有关）

Is there a cross-browser solution? (for Apache/PHP server if that is relevant)

如果你去seo.hr和浏览导航，......你可以看到我想要做的。

If you go to seo.hr and browse navigation,... you can see what I'm trying to do.

http://www.seo.hr/

http://www.seo.hr/usluge/izrada-stranica

<一个href=\"http://www.seo.hr/usluge/optimizacija-za-trazilice\">http://www.seo.hr/usluge/optimizacija-za-trazilice

推荐答案

我觉得你首先需要确定的问题实际上是一个缓存的问题，或者如果它是由图像的大小而引起的。你可以使用像Wireshark的提琴手或程序要做到这一点，但说实话这是矫枉过正您的需求，你可能已经有了开发工具的浏览器。

I think you need to determine first if the issue actually is a caching issue or if it's caused by the size of your image. You could use a program like Wireshark or Fiddler to do this, but to be honest it's overkill for your need and you probably already have a browser with developer tools.

下面是你如何确定的图像在Chrome中（其他浏览器都差不多）。

Here's how you determine where an image is coming from in Chrome (the other browsers are similar).

1. 打开你的开发工具，并进入网络选项卡。


2. 在网络请求的列表中找到bg.png，并点击它的名字。下面是从当前页具有选定堆栈溢出图像的一个例子。

请注意，它说200的状态（从缓存）。该浏览器没有需要出去到服务器并rerequire该资源。它使用缓存。如果说，从缓存中的文字是不存在它不是重复使用缓存的资源。

Notice that it says status 200 (from cache). The browser didn't need to go out to the server and rerequire that resource. It used the cache. If that "from cache" text wasn't there it wasn't reusing cached resources.

还有，你会得到304状态code这意味着，服务器说，自从您所做的最后一个请求的图像没有被修改的可能性。你这样做使在这种情况下，服务器的行程。

There is also the potential that you'll get a status code of 304. That means that the server said the image wasn't modified since the last request that you made. You do make the server trip in that case.

确定，所以我的形象是不是在缓存中......现在该怎么办？

有几个原因，这可能发生。

There are a few reasons that this could occur.

1. 您是请求头未设置告诉浏览器缓存图像（也即你会看到状态code。如果浏览器竟跑到服务器相同的头标签中找到图片）。你要设置缓存控制和终止的东西，是有道理的，你。缓存头可以得到一个有点复杂，你可能希望通过浏览本教程的缓存文件。


2. 它是SSL？如果因此并不是所有的浏览器缓存这一点，但最现代的浏览器做的。设置缓存控制：公开对这些图像（以及到期）

1. You're request headers aren't set to tell the browser to cache the image (also found in that same "Headers" tab that you would have seen that Status Code if the browser actually went to the server for the image). You'll want to set cache-control and expires to something that makes sense for you. Cache headers can get a bit complicated you may want to browse through this caching tutorial document.
2. Is it SSL? If so not all browsers cache this but most modern browsers do. Set cache-control: public on these images (and also expires).

确定，所以我的图像缓存....

请参考其他的答案，因为他们已经涵盖了这些内容。

Refer to the other answers as they have already covered this content.

这篇关于缓存的背景图片的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！