站长分享前端2个调试技巧-技术圈

同事分享的2个前端调试技巧，知道后极大的方便了B/S开发调试，本文只对谷歌浏览器进行讲解，其他浏览器用的不多。

1. 网页刷新

常用的网页刷新快捷方式：

F5刷新时大部分资源的状态码都是304，也就是重定向，大部分都是使用缓存资源。

简单的理解就是让浏览器重新访问网页，就像第一次那样，一切都是全新呈现，打开速度也会稍慢一些。

Ctrl+F5刷新时所有资源状态码都是200，都是重新从服务器下载了资源。这实际上是浏览器的“智能化”表现，为了尽可能提高网页打开速度，减少等待时间，浏览器会自动缓存网页静态资源以备再次使用，如图片、样式、脚本等文件。

什么情况下需要使用Ctrl+F5刷新网页？

网页修改过图片、样式、脚本等静态文件后，F5普通刷新看不到实时效果，经常折腾前端修改的朋友很有必要掌握此技能，做为一种习惯也不会错。另外，每次修改网页前端代码时，为静态文件加载语句加上不同版本号参数，如src="main.js?t=201903182557"这样，也能避免缓存情况。

顺便科普一下，网站使用第三方CDN加速时，采用的是网络节点缓存技术，这种情况使用Ctrl+F5刷新网页无法更新网络节点上的缓存文件，更新缓存文件需要在加速平台进行操作。

本节重点来啦

有些网页，使用Ctrl + F5强制刷新并不能真正的起作用，站长推荐：打开需要刷新的网页，F12调出调试界面，鼠标焦点放在浏览器地址栏左侧刷新按钮，鼠标右键弹出刷新菜单，点击清空缓存并硬性重新加载菜单即可，记住按F12哦，正常情况是刷新按钮是无法弹出菜单的。

正常情况下一个网站即有登录入口也有注销入口，但也有例外，如果你正在开发一个网站，注销功能还未实现，想调试功能权限....

想换个其他角色的账号，只能使用手动输入登录URL地址的方式吗？

其实不然，还是和第1个技巧一样，按下F12，删除登录的token，再刷新网页即可。

以上只是平时开发时站长使用的技巧，相信有人没用过，对专业前端小伙伴这多半是小case了，你还有其他什么技巧吗？欢迎下方留言分享。

参考文章：