Login_index.html:
<script type="text/javascript">
var verifyUrl = '{:U("Admin/Login/verify",'','')}';//第三参数为空即不加后缀名
</script>
<script type="text/javascript" src="__PUBLIC__/Js/login.js"></script>
<tr>
<th>验证码:</th>
<td>
<input type="code" class="len250" name="code"/> <img src="
{:U('Admin/Login/verify')}" id="code"/> <a href="javascript:void(change_code(this));">看不清</a>
</td>
</tr>
login.js:
function change_code(obj){
$("#code").attr("src",verifyUrl + '/' + Math.random());//加个随机数重新刷新页面即刷新了验证码。
return false;
}
由于浏览器会对同一 url 的图像进行缓存,减少服务器端的请求次数,提高浏览性能。
利用附加一个随机数,来避免客户端浏览器使用缓存。让每次点击刷新验证码的时候
请求的 URL 路径都不同,告诉浏览器上个图片已经失效了,需要重新向服务器上请求
新的图片信息。
因为如果每次都是请求同一个页面,此时客户端浏览器会调用缓存中的页面。
而如果你每次都附加一个不同随机数给url,那么客户端会以为是新的页面,从而会向
服务器请求,这样才能实现每次点击都会刷新验证码的效果。
在ThinkPHP框架中,为了防止浏览器缓存验证码图像,通常会在验证码刷新时添加一个随机数到URL中。这是因为浏览器为提高性能会缓存同一URL的资源。通过动态改变URL,浏览器认为这是新的请求,从而避免使用缓存,确保每次都能获取最新的验证码图像,实现有效的验证码刷新功能。
598

被折叠的 条评论
为什么被折叠?



