chrome浏览器的【Overrides】功能

前言

想要修改现网的一些小功能,但是又不想走改代码、提工单、审批。。。等烦人的流程,这时候Overrides功能就体现出它强大的功能了,当然只限于本地的浏览器。但不是真正的修改远程服务器的文件

如何使用Overrides功能

在自己电脑创建一个空文件夹,用来保存接下来想要重写的js文件

打开想要调试网站的浏览器控制台,切换到Sources栏,点击更多工具,选择Overrides选项卡,点击选择选择overrides文件夹,会弹出选择文件夹窗口,选择步骤1创建的文件夹,之后会弹出文件夹访问权限,选择允许即可

然后返回到Page选项卡,选择想要重写的js文件,右键选择保存到overrides,这时候就会发现之前创建的overrides文件夹里已经有了刚才保存的文件夹

点击代码美化,就可以在操作栏里去进行代码编辑了,操作完直接Ctrl+S保存就可以了

这时候Network选项卡会有黄色警告,提示可能会存在本地重写,想要取消也很简单,直接在Sources选项卡将重写关闭即可,关闭之后Network警告会消失

总结

  1. 此办法可以避免一些小功能再次上线,如果前端上线需要各种流程的话可以尝试这种办法应急一下
  2. 可以作为线上环境断点调试,可扩展性更强,比单纯的打断点更好
  3. 功能可以随时关闭

缺点

  1. 只能作为临时方案使用,毕竟不能覆盖所有人,修改也只是在当前电脑生效
  2. 代码是混淆后的,修改可能会带来一些未知的风险,需要看懂前后的逻辑关系才不会出错
  3. 新功能上线后文件的contenthash会改变,本地修改的文件就作废
相关推荐
无风听海18 小时前
Promise 与 Async Await 深度解析
前端·javascript
牛奶18 小时前
AI 永远说好,于是我们只会说 yes
前端·aigc·ai编程
浩风祭月18 小时前
把前端项目的 CI 构建时间从 15 分钟压到了 2 分钟
前端·ai编程
牛奶18 小时前
黑客是怎么看到你数据的?
前端·安全·黑客
ihuyigui18 小时前
国际企业办公短信接口
前端·后端·架构
lpd_lt18 小时前
服务端类vue等页面AI测试方向
前端·vue.js·人工智能
AugustRed18 小时前
A2UI 完整学习指南(含 Java 后端 + 前端实战示例)
java·开发语言·前端
王莎莎-MinerU18 小时前
Agent 时代,科学数据 API 需要重新设计
大数据·前端·数据库·人工智能·个人开发
jingling55518 小时前
自建技术博客实战(三):工具专栏——地图定位、声音复刻与 rembg 抠图
android·开发语言·前端·ai·nextjs
小小小小宇18 小时前
Chrome 插件在新开页生效
前端