如何解决网站页面CSS、JS脚本在浏览器的缓存问题

最新推荐文章于 2025-03-18 23:32:32 发布

小虎哥-技术博客

最新推荐文章于 2025-03-18 23:32:32 发布

阅读量3.1k

点赞数

分类专栏： PHP 文章标签： php

本文链接：https://blog.csdn.net/weng_xianhu/article/details/79419649

版权

PHP 专栏收录该内容

113 篇文章

订阅专栏

本文介绍了一种通过在静态文件URL后添加版本号来解决浏览器缓存问题的方法，并提供了具体的PHP实现代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

客户在浏览器访问一个页面之后，浏览器会缓存一些静态文件，比如：css、js等。当技术人员对这些静态文件修改并传到服务器之后，有时客户端这边访问还是没有效果，必须Ctrl+F5强制刷新多次才有效，这往往因为浏览器缓存了css、js等静态文件所造成，解决浏览器缓存这个问题的方法便是在后面加上版本号，达到实时刷新的效果。

加版本号之前：

加版本号之后：

具体PHP实现代码：

/**
 * 给静态文件追加版本号，实时刷新浏览器缓存
 * 参数 $filepath 为文件路径
 */
function static_version($filepath)
{
    // ROOT_PATH 是当前项目所在的绝对根目录
    if (!file_exists(ROOT_PATH.ltrim($filepath, '/'))) {
        return false;
    }
    $http_url = 'http://www.lvxing1788.com' . $filepath;
    $parseStr = '';
    $headInf = @get_headers($http_url,1); 
    if (is_array($headInf)) {
        $update_time = strtotime($headInf['Last-Modified']); 
        $type = strtolower(substr(strrchr($http_url, '.'), 1));
        switch ($type) {
            case 'js':
                $parseStr .= '<script type="text/javascript" src="' . $http_url . '?ver='.$update_time.'"></script>';
                break;
            case 'css':
                $parseStr .= '<link rel="stylesheet" type="text/css" href="' . $http_url . '?ver='.$update_time.'" />';
                break;
            case 'ico':
                $parseStr .= '<link rel="shortcut icon" href="' . $http_url . '?ver='.$update_time.'" />';
                break;
        }
    }
    return $parseStr;
}

html页面调用方式：

{php}echo static_version('/template/common/css/index.css');{/php}