Question

从我注意到的情况来看，如果我有1个CSS文件和10个使用相同CSS文件的网页，每次我进入新页面时，都会重新下载CSS文件。

无论如何我可以阻止这种情况发生吗？因此，如果客户端已经下载了一次，那么不用再费心了吗？

Answer 1

它已经是这个浏览器缓存的原因了。别担心。

Answer 2

将expires标头添加到您的css文件中，以便浏览器不会尝试下载更新的版本。即使您的css文件被缓存，如果文件已被更改，您的浏览器也会向服务器发送请求。

Answer 3

Threre are two ways 

1. use .htacess in that folder and set something like this  

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$">
Header set Cache-Control "public"
Header set Expires "Thu, 15 Apr 2010 20:00:00 GMT"
</FilesMatch>

2. Use PHP 

    function __read($files)
    {
        $data   = '';
        foreach ($files as $file)
        {
            $FileName   =WEBROOT . $file;
            if (file_exists($FileName))
            {
                $fileHandle = fopen($FileName, 'r');
                $data      .= "/*--#--".$file."--#--*/".fread($fileHandle, filesize($FileName));
                fclose($fileHandle);
            }
        }
        return $data;
    }

    $files[] = "css/frontend/registration.css";
    $files[] = "css/frontend/default.css";
    $data = $this->__read($files);

    // Tell the browser that we have a CSS file and send the data.
    if (isset($data))
    {
            header("Content-type: text/css");
            header("Cache-Control: public");
            header("Expires: " . gmdate("D, d M Y H:i:s", time() + 3600 * 24 * 7) . " GMT");        
            header("Etag: ".md5_file(__FILE__));
            echo $data;
    }

Answer 4

您是否可以访问httpd.conf或.htaccess配置文件？（如果是Apache服务器的话）

如果是，请考虑以下设置：

Header unset ETag
FileETag None
Header set Cache-Control "max-age=2678400"

前两个规则完全禁用ETag，因此浏览器有点被迫监听Cache-Control标头。最后一条规则告诉浏览器将文件缓存2678400秒或1个月。将设置调整为最适合您的设置。并在包含静态文件的目录上应用此配置（例如，在该目录中放置.htaccess文件）

可选，如果您使用多个服务器来提供静态内容，和/或不确定这些服务器报告的上次修改时间，请考虑使用：

Header unset Last-Modified

它告诉Apache不提供任何Last-Modified标头，因此浏览器只能监听Cache-Control max-age标头。

我自己在许多高效网站上使用此设置，禁用ETag和Last-Modified标头确实有助于将流量降低到过去的五分之一。特别是Internet Explorer对这些设置非常敏感。

哦，如果你不确定你的缓存;使用http://www.redbot.org/来测试您的资产，它会快速告诉您标题对浏览器的意义，以及如何解释您使用的不同缓存控制设置。

Answer 5

如果你有3个网页，我认为你应该为你的css使用相同的域名：

http://example.com
http://example2.com
http://example3.com

所以你应该使用每个主机，例如这个css url：

<link href="http://static.example.com/css/style.css" rel="stylesheet" type="text/css" />

然后浏览器应该缓存此文件而不是每次都下载它，因为url始终是相同的。

防止一遍又一遍地下载相同的CSS文件

5 个答案: