我们在使用迅睿CMS制作前端模板时，经常需要更改前端样式并查看更改后的效果。

但是在实际制作过程当中，我们在每次修改后，都需要清除浏览器缓存，方可查看到效果，略显麻烦。

那么如何在修改后能够及时查看到效果呢？

要想解决这个问题，需要知道为什么不能及时刷新。

这是因为浏览器的缓存机制造成的。在浏览器加载文件时，如果缓存当中已经存在对应的文件，则会加载缓存文件而不会向服务器重新请求文件。所以我们只需要保证浏览器中没有对应的缓存文件即可。

以下的方法，不仅仅适用于迅睿，也适用所有的大部分CMS系统。

一、如何关闭缓存配置

前端文件主要包含HTML,CSS,JS等。

对于HTML，只需要在公共的头文件的head标签中添加no-cache标识即可。具体代码如下：

<!-- nocache start -->
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" />
<!-- nocache end -->

添加后，html文件使用F5刷新后会及时更新，但是html文件中载入的css,js等文件仍然不能及时更新。

此时，只需要在在对应的css,js中添加版本标识即可。参考以下样例：

<link rel="stylesheet" href="{HOME_THEME_PATH}css/style.css?v={php}echo rand(1,10000){/php}" />
<script src="{HOME_THEME_PATH}js/custom.js?v={php}echo rand(1,10000){/php}"></script>

上面代码的简要说明：rand()为php函数，会生成1到10000之间的随机数。每次html加载，都会在"v="后面生成一个随机数，这样每次加载后都会重新向后台请求新的文件。

二、如何快速开启和关闭

以下方法仅适用于迅睿，其它CMS请自行配置

在网站正式上线后，我们需要删除以上的缓存配置。也可添加开关，方便以后更改，其步骤如下：

1、在/config/custom.php添加以下代码：

// 及时更新
function htmlnocache($cached  = 1)
{
    if ($cached === 1) {
        echo '<!-- nocache start -->';
        echo '<meta http-equiv="pragma" content="no-cache">';
        echo '<meta http-equiv="cache-control" content="no-cache">';
        echo '<meta http-equiv="expires" content="0">';
        echo '<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" />';
        echo '<!-- nocache end -->';
    }
}

function htmlrand($cached = 1)
{
    if ($cached === 1) {
        echo '?v=' . rand(1, 100000);
    }
}

2、更新HTML模板代码

在模板头部的head标签内添加以下代码，即可开启清除缓存设置：

{htmlnocache()}

在你需要更新的css或js文件后添加对应随机函数，下面是样例：

<link rel="stylesheet" href="{HOME_THEME_PATH}css/style.min.css{htmlrand()}" />
<script src="{HOME_THEME_PATH}js/custom.js{htmlrand()}"></script>

3、上线后关闭清除缓存配置即可，改为htmlnocache(0)和htmlrand(0)

{htmlnocache(0)}
<link rel="stylesheet" href="{HOME_THEME_PATH}css/style.min.css{htmlrand(0)}" />
<script src="{HOME_THEME_PATH}js/custom.js{htmlrand(0)}"></script>