Chrome DevTools控制台无说明红色标记问题含义咨询

• 无文字说明的红色标记本质是未在控制台展示详情的报错，占比最高的是网络类错误：包括CORS跨域请求失败、资源加载超时、请求被浏览器扩展/网络安全规则拦截，这类错误默认未开启详情展示时只会显示红色标记，不会附带文字说明。
• 批量出现90+同类红色标记的场景，通常对应页面批量加载的资源出现统一访问失败：比如批量引入的图标资源路径配置错误、分片加载的脚本块CDN失效、循环触发的请求被统一拦截、本地开发环境代理规则配置错误。
• 可通过以下操作获取具体错误信息：
  • 切换到「网络」面板，筛选状态为失败的请求，对应时间点的异常请求即为报错来源，点击请求即可查看具体失败原因
  • 打开控制台设置，勾选「Console」分类下的「显示网络错误详情」「记录XMLHttpRequest请求」选项，刷新页面后即可在控制台看到完整报错说明
  • 临时禁用所有浏览器扩展后重试，排查是否是扩展的资源拦截规则导致的无提示报错

内容的提问来源于stack exchange，提问作者Ayah Almahrouq