Edge开发者工具:保留日志与禁用缓存详解

Microsoft Edge 浏览器 (或基于 Chromium 的浏览器,如 Chrome)中,"保留日志""禁用缓存" 是开发者工具(DevTools)中的两个非常实用的功能,主要用于调试网页加载、网络请求和性能问题。下面详细介绍这两个功能的用途与用法。


🧩 一、"保留日志"(Preserve Log)

✅ 功能说明:
  • 当你刷新页面时,默认情况下,Network 面板中的日志会被清空
  • 启用"保留日志"后,即使刷新页面,之前的网络请求记录也不会被清除,可以连续查看多个页面加载过程中的所有请求。
🔧 使用方法:
  1. 打开 Edge 浏览器 → 按 F12 或右键点击页面选择「检查」打开 开发者工具
  2. 切换到 "网络"(Network) 标签页。
  3. 在顶部工具栏中,找到并勾选:
    "保留日志" (通常是一个小方框图标,旁边写着"保留日志"或英文 "Preserve log")
    (如图中红色框标注位置)

⚠️ 注意:这个选项在某些版本中可能显示为"Keep log"或中文"保留日志"。

💡 使用场景:
  • 调试多步操作(如登录 → 跳转 → 提交表单)时的完整请求链。
  • 分析页面刷新前后的请求差异。
  • 追踪跨页面的 API 请求是否正常。

🧩 二、"禁用缓存"(Disable Cache)

✅ 功能说明:
  • 浏览器会缓存静态资源(如 JS、CSS、图片等),以提升加载速度。
  • 启用"禁用缓存"后,浏览器将强制重新从服务器获取资源,不使用本地缓存。
🔧 使用方法:
  1. 打开开发者工具 → 进入 "网络"(Network) 标签页。
  2. 勾选:
    "禁用缓存"(通常是一个小图标,像一个禁止符号,旁边写"禁用缓存"或英文 "Disable cache")

⚠️ 注意:此功能只对当前 DevTools 会话生效,关闭后自动失效。

💡 使用场景:
  • 开发阶段测试最新代码是否生效(例如修改了 JS 文件但未更新)。
  • 排查因缓存导致的页面异常(如样式未更新、脚本报错等)。
  • 确保每次请求都发送到服务器,便于调试接口响应。

✅ 组合使用建议:

表格

场景 推荐设置
调试页面加载流程 ✅ 保留日志 + ✅ 禁用缓存
查看接口返回错误 ✅ 保留日志 + ✅ 禁用缓存
测试缓存机制 ❌ 不启用禁用缓存
快速排查资源加载失败 ✅ 保留日志

📌 小贴士

  • "禁用缓存"不会影响 Cookie、Session 等认证信息,仅影响静态资源缓存。
  • 如果你希望永久禁用缓存(比如开发环境),可以在浏览器设置中开启"开发者模式"或使用 --disable-cache 启动参数(高级用户)。
  • 在 Network 面板中,还可以结合 过滤器(如只看 XHR、JS、CSS)来更精准地分析请求。
相关推荐
qq_513728049 小时前
StaleElementReferenceException(陈旧元素引用异常)
python
zhangminghuan9 小时前
微信小程序开发核心知识点全景解析(前端必备硬核基础)
前端·微信小程序·小程序
千里码aicood9 小时前
基于Python的电商数据采集系统(大数据+爬虫)
开发语言·python
莫得感情 o9 小时前
并发 14 · 收官:虚拟线程与结构化并发
java·并发
boooooooom9 小时前
尝尝咸淡:从朴素 RAG 到 Graph RAG——一个烹饪问答系统的三层检索升级之路
前端·后端·llm
cindershade9 小时前
让每条前端异常都能回答:该由谁修、为什么现在修
前端
聚美智数9 小时前
图片水印-图片剪裁-图片缩放API接口介绍
java·服务器·数据库
战略性的菠萝9 小时前
研究生基础-Python快速入门(终)——面向对象
python
陈皮波比茶9 小时前
Python项目实战-网络机器人(爬虫)
开发语言·网络·爬虫·python·机器人
bitbrowser9 小时前
Telegram提示尝试次数过多,换网络和重装有用吗
前端