VSCode本身不直接捕获网络请求延迟与状态码，需依赖工具链：Live Server+浏览器DevTools查看网页请求，REST Client扩展显示API耗时与状态码，React Native项目则需Flipper+vscode-react-native网络检查器。
VSCode 本身不直接捕获或显示网页或后端服务的网络请求延迟与状态码，必须依赖外部工具链组合实现——核心路径是：用 Live Server 启动页面 + 浏览器 DevTools 查 Network，或用 REST Client 发送请求 + 状态栏读取耗时与状态。
Live Server + 浏览器 Network 面板看网页请求
这是前端 HTML/JS 项目最常用、零配置的方式。VSCode 只负责起服务，真正的网络数据在浏览器里。
- 安装
Live Server扩展（Ritwick Dey 开发），右键 HTML 文件选Open with Live Server - 页面自动在浏览器中打开，按
F12打开开发者工具，切换到Network标签页 - 刷新页面，所有请求立即列出：每行含
Status（状态码）、Time（总延迟）、Size、Initiator（谁发起的） - 勾选
Preserve log可跨跳转保留记录；启用Disable cache避免缓存干扰真实延迟 - 注意：XHR/Fetch 请求只有 JS 实际执行后才会出现在列表里，静态资源（HTML/CSS/JS）加载完就结束了
REST Client 扩展查 API 请求耗时与响应头
适合调试后端接口、写 .http 文件发请求，延迟和状态码直接回显在 VSCode 界面底部。
- 安装
REST Client扩展（Huachao Mao），新建文件保存为test.http - 写一个请求，例如：
GET https://httpbin.org/get
- 光标停在请求体上，按
Ctrl+Alt+R（Windows/Linux）或Cmd+Alt+R（macOS）发送 - 响应窗口顶部会显示
200 OK和耗时（如144ms）；悬停在耗时数字上能看到各阶段细分（DNS、TCP、TTFB 等） - 响应头里有
Content-Length、Server等字段，状态码直接在首行，不用翻响应体 - ⚠️ 注意：
rest-client.timeoutinmilliseconds默认是 10 秒，超时会报connect ETIMEDOUT，不是服务端返回的 5xx
React Native 项目要用 Flipper + vscode-react-native 网络检查器
纯 WebView 或原生模块发的请求，浏览器 DevTools 看不到，必须走 Flipper 通道。
- 确保项目已集成 Flipper（
react-native-flipper），且 iOS/macOS 已装idb-companion、OpenSSL - VSCode 中按
Ctrl+Shift+P，输入并运行Run Network Inspector - 设备连上后，VSCode 底部状态栏出现
Network Inspector: Connected，点击可打开独立面板 - 面板里每条请求带完整时间线、
status code、request headers、response body（支持 JSON 格式化） - ⚠️ 常见失败点：Android 模拟器需手动设置代理；iOS 真机需信任证书；Flipper 插件版本要匹配 RN 版本
真正容易被忽略的是环境隔离问题：Live Server 的请求走本地 localhost，REST Client 默认不带 cookie，React Native 网络检查器只抓 App 进程内流量——三者监控范围互不重叠，选错工具就看不到目标请求。
