网络调试的艺术：利用浏览器Network工具优化你的网站

发布于：2025-06-27 ⋅ 阅读:(19) ⋅ 点赞:(0)

🧭 General（通用信息）

General 部分通常包含请求的基本信息，如请求方法、URL、协议版本等

字段名称 描述 常见值示例
Request URL 请求的完整地址（包括协议、域名、路径、查询参数） https://example.com/api/data?query=1
Request Method 客户端使用的 HTTP 方法 GET, POST, PUT, DELETE, PATCH
Status Code 服务器返回的状态码及描述 200 OK, 404 Not Found, 500 Internal Server Error
Remote Address 服务器的 IP 地址和端口号 192.0.2.1:443
Referrer Policy 控制请求中 Referrer 头部的发送方式 no-referrer, same-origin, strict-origin-when-cross-origin
Provisional headers are shown 表示当前展示的是初步/临时请求头，可能未完全发送 true（仅用于调试显示）

Request Method

序号 方法 描述 使用场景和作用
1 GET 请求指定的页面信息，并返回实体主体。

- 获取资源，如网页、图片等。

-不应该用于修改服务器上的数据。

- 数据通过URL参数传递，长度有限制。
2 POST 向指定资源提交数据进行处理请求（例如提交表单或上传文件）。

- 通常用于创建新资源或提交数据。

- 数据包含在请求体中，对数据大小没有明确限制。

- 安全性较好。
3 PUT 从客户端向服务器传送的数据取代指定文档的内容。

- 更新已存在的资源。

- 如果资源不存在，可能会根据具体实现创建新的资源。
4 DELETE 请求服务器删除指定的页面或资源。

- 删除资源。

- 成功时通常返回状态码 204 No Content 或 200 OK 并附带删除成功的信息。
5 HEAD 类似于 GET 请求，但只请求消息报头，不返回消息主体。

- 获取资源的元数据，如检查文件是否存在、获取文件大小等。

- 适用于需要了解资源头部信息而不关心内容的情况。
6 OPTIONS 返回服务器支持的所有HTTP请求方法，或与特定URL相关的选项。

- 用于跨域请求前的预检请求，确认服务器允许的方法。

- 检查服务器功能。
7 PATCH 对资源进行部分修改。

- 仅更新资源的部分字段，而不是完全替换它。

- 相比于 PUT 更高效，因为不需要传输整个资源。
8 CONNECT 建立一个到由目标资源标识的服务器的隧道。

- 主要用于 HTTPS 连接建立。

- 允许客户端与服务器之间建立直接的通信通道。
9 TRACE 回显服务器收到的请求，主要用于测试或诊断。

- 调试目的，查看请求到达服务器的状态。

- 现代应用中较少使用，且出于安全考虑，许多服务器禁用此方法。

🌐 Referrer Policy 概述

什么是 Referrer Policy？

  • 是一个 HTTP 响应头字段（也可用于 HTML 元素），用于控制浏览器在发出请求时是否以及如何发送 Referer 请求头。
  • 主要作用是 保护隐私、增强安全性。

🔐 作用

目标 描述
隐私保护 控制发送的 Referer 信息，防止泄露敏感路径或参数
安全增强 减少跨站请求中的信息泄露风险

📋 支持的值及其含义

值 行为描述 使用场景
no-referrer 不发送 Referer 头 完全隐藏来源信息
no-referrer-when-downgrade (默认) HTTPS → HTTP 不发送；其他情况发送完整 URL 默认安全策略
origin 发送协议 + 主机 + 端口（不包括路径和查询） 跨域时只暴露源信息
origin-when-cross-origin 同源发完整；跨源只发源 平衡同源详细信息与跨源隐私
same-origin 同源发完整；跨源不发 只允许内部引用发送完整信息
strict-origin HTTPS → HTTP 不发；其他跨源只发源 更严格的源控制
strict-origin-when-cross-origin 同源发完整；跨源发源；HTTPS→HTTP 不发 推荐现代网站使用
unsafe-url 总是发送完整 URL（包括路径和查询参数） 需要完整引用信息（注意泄露风险）

🛠 设置方式

1. HTTP 响应头设置

Referrer-Policy: strict-origin-when-cross-origin

2. HTML 元素属性设置

支持以下标签：<a>, <area>, <img>, <link>, <script> 等：

<img src="image.jpg" referrerpolicy="no-referrer">
<a href="https://example.com" referrerpolicy="origin">链接</a>

✅ 推荐策略

场景 推荐值 说明
默认使用 strict-origin-when-cross-origin 最佳平衡：兼顾隐私和功能
高隐私需求 no-referrer 或 origin 避免暴露用户访问路径
内部系统通信 same-origin 仅允许内部页面传递完整信息
第三方资源加载 origin 或 strict-origin 防止将敏感路径传给第三方

📌 小贴士

  • HTTPS 到 HTTP 属于降级请求，大多数策略在此情况下会限制 Referer 发送。
  • Referer 头可能包含路径或查询参数，因此不当设置可能导致敏感信息泄露。
  • 不同浏览器对某些策略的支持略有差异，建议以主流浏览器为准（如 Chrome、Firefox、Edge）

📥 Request Headers（请求头）

Request Headers 包含客户端发送给服务器的头部信息，用于描述请求的属性

字段名称 描述 常见值示例
Accept 客户端接受的内容类型 text/html,application/xhtml+xml;q=0.9,*/*;q=0.8
Accept-Encoding 客户端支持的内容编码格式 gzip, deflate, br
Accept-Language 客户端首选语言 en-US,en;q=0.9,zh-CN;q=0.8
Authorization 身份验证凭证（如 Token 或 Basic Auth） Bearer <token>, Basic base64encode(username:password)
Cache-Control 缓存控制指令 no-cache, max-age=0
Connection 网络连接控制 keep-alive, close
Content-Length 请求体大小（字节） 1234
Content-Type 请求体的数据类型 application/json, application/x-www-form-urlencoded, multipart/form-data
Cookie 客户端存储的 Cookie 数据 sessionid=abc123; csrftoken=xyz789
DNT Do Not Track 指令 1（用户希望不被跟踪）
Host 请求的目标主机名和端口 example.com, example.com:8080
Origin 请求来源域（用于 CORS） https://another-site.com
Referer 当前请求是从哪个页面发起的 https://referrer.com/page
User-Agent 浏览器和系统标识信息 Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36...
Upgrade-Insecure-Requests 是否希望升级到 HTTPS 1
Sec-Fetch-Dest 请求目标类型 document, script, image
Sec-Fetch-Mode 请求模式 navigate, cors, no-cors
Sec-Fetch-Site 请求来源站点关系 same-origin, same-site, cross-site
Sec-Fetch-User 请求是否由用户触发 ?1（是）、?0（否）
TE 支持的传输编码方式 trailers
X-Requested-With 标识是否为 AJAX 请求 XMLHttpRequest

✅ 常见 HTTP 请求头（Request Headers）列表

  1. Accept

    • 含义：指示客户端能够处理的内容类型。
    • 常见值：text/html, application/json, application/xml, image/*, */*

  2. Accept-Charset

    • 含义：指示客户端能够处理的字符集。
    • 常见值：UTF-8, ISO-8859-1, *

  3. Accept-Encoding

    • 含义：指示客户端能够处理的内容编码方式。
    • 常见值：gzip, deflate, br, *

  4. Accept-Language

    • 含义：指示客户端偏好的语言。
    • 常见值：en-US, zh-CN, fr-FR, *

  5. Authorization

    • 含义：用于向服务器提供认证信息。
    • 常见值：Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==, Bearer <token>

  6. Cache-Control

    • 含义：指示缓存机制如何处理请求和响应。
    • 常见值：no-cache, no-store, max-age=<seconds>, must-revalidate, public, private

  7. Connection

    • 含义：指示如何管理连接。
    • 常见值：keep-alive, close

  8. Content-Length

    • 含义：表示请求体的长度（以字节为单位）。
    • 常见值：123

  9. Content-Type

    • 含义：表示请求体的媒体类型。
    • 常见值：application/x-www-form-urlencoded, application/json, multipart/form-data, text/plain, image/jpeg, application/pdf

  10. Cookie

    • 含义：包含客户端的 cookie 信息。
    • 常见值：session=abc123; user=JohnDoe

  11. Host

    • 含义：指示请求的目标主机和端口号。
    • 常见值：example.com, example.com:8080

  12. Origin

    • 含义：指示请求的来源（用于 CORS）。
    • 常见值：http://example.com

  13. Referer（或 Referrer）

    • 含义：指示请求的来源页面。
    • 常见值：http://example.com/page1

  14. User-Agent

    • 含义：指示客户端的用户代理信息（浏览器、操作系统等）。
    • 常见值：
      • Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36
      • Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36
      • Mozilla/5.0 (iPhone; CPU iPhone OS 14_4 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Mobile/15E148 Safari/604.1

  15. If-Modified-Since

    • 含义：指示客户端缓存的资源的最后修改时间，用于条件请求。
    • 常见值：Wed, 21 Oct 2015 07:28:00 GMT

  16. If-None-Match

    • 含义：指示客户端缓存的资源的 ETag，用于条件请求。
    • 常见值：W/"644b5b3c2974d80e68a067c5"

  17. Range

    • 含义：请求资源的一部分。
    • 常见值：bytes=0-1023, bytes=1024-2047

  18. Upgrade

    • 含义：请求升级到其他协议。
    • 常见值：h2c, h2, WebSocket

  19. Sec-WebSocket-Key

    • 含义：WebSocket 握手时的密钥。
    • 常见值：dGhlIHNhbXBsZSBub25jZQ==

  20. Sec-WebSocket-Version

    • 含义：WebSocket 协议的版本。
    • 常见值：13

  21. Sec-Fetch-Site

    • 含义：指示请求的来源站点。
    • 常见值：same-origin, same-site, cross-site, none

  22. Sec-Fetch-Mode

    • 含义：指示请求的模式。
    • 常见值：navigate, no-cors, cors, same-origin

  23. Sec-Fetch-Dest

    • 含义：指示请求的目标。
    • 常见值：document, image, script, style, iframe, font, audio, video

  24. Sec-Fetch-User

    • 含义：指示请求是否由用户发起。
    • 常见值：?1, ?0

  25. DNT（Do Not Track）

    • 含义：指示客户端是否希望不被跟踪。
    • 常见值：1, 0

  26. TE（Transport Encoding）

    • 含义：指示客户端支持的传输编码。
    • 常见值：trailers, chunked

  27. Pragma

    • 含义：用于向后兼容 HTTP/1.0 缓存控制。
    • 常见值：no-cache

  28. X-Requested-With

    • 含义：指示请求是否由 AJAX 发起。
    • 常见值：XMLHttpRequest

  29. X-Forwarded-For

    • 含义：指示客户端的 IP 地址，通常由代理服务器设置。
    • 常见值：192.168.1.1

  30. X-Forwarded-Proto

    • 含义：指示客户端请求的协议，通常由代理服务器设置。
    • 常见值：https, http

  31. X-Forwarded-Host

    • 含义：指示客户端请求的主机，通常由代理服务器设置。
    • 常见值：example.com

  32. X-Forwarded-Port

    • 含义：指示客户端请求的端口号，通常由代理服务器设置。
    • 常见值：80, 443

📤 Response Headers（响应头）

Response Headers 包含服务器发送给客户端的头部信息，用于描述响应的属性。

字段名称 描述 常见值示例
Access-Control-Allow-Credentials 是否允许跨域携带凭据 true
Access-Control-Allow-Headers 允许的跨域请求头字段 Content-Type, Authorization
Access-Control-Allow-Methods 允许的跨域请求方法 GET, POST, PUT, DELETE
Access-Control-Allow-Origin 允许访问的源（CORS） *, https://trusted-site.com
Access-Control-Expose-Headers 可以暴露给客户端的头部字段 X-Custom-Header
Access-Control-Max-Age 预检请求缓存时间（秒） 86400
Age 响应从缓存中获取的时间（秒） 3600
Cache-Control 缓存策略 public, max-age=3600, no-cache
Content-Encoding 响应内容的编码方式 gzip, deflate, br
Content-Length 响应体长度（字节） 2048
Content-Type 响应内容的 MIME 类型 text/html, application/json, image/png
Date 服务器生成响应的时间 Tue, 03 Jun 2025 22:34:00 GMT
ETag 资源版本标识符，用于缓存校验 "abc123"
Expires 响应过期时间 Wed, 04 Jun 2025 22:34:00 GMT
Last-Modified 资源最后修改时间 Mon, 02 Jun 2025 12:00:00 GMT
Location 重定向地址 https://example.com/new-path
Pragma HTTP/1.0 的缓存控制兼容字段 no-cache
Server 服务器软件标识 nginx/1.18.0, Apache/2.4.41
Set-Cookie 服务器设置的 Cookie sessionid=abc123; Path=/; Secure; HttpOnly
Strict-Transport-Security 强制使用 HTTPS max-age=31536000; includeSubDomains
Vary 缓存区分依据的请求头字段 Accept-Encoding, Origin
X-Content-Type-Options 禁止浏览器猜测内容类型 nosniff
X-Frame-Options 控制页面是否可以嵌入 iframe DENY, SAMEORIGIN
X-Powered-By 后端技术标识 PHP/7.4.3, Express
X-XSS-Protection 启用 XSS 过滤机制 1; mode=block
Bee-Subapi-Restful 自定义响应头，通常为内部服务标识 v1.0.0
Edge-Channels CDN 或边缘网络通道标识 prod, staging
Transfer-Encoding 响应数据的传输编码方式 chunked

✅ 常见 HTTP 响应头（Response Headers）列表

  1. Access-Control-Allow-Origin

    • 含义：指示哪些源可以访问资源（用于 CORS）。
    • 常见值：*、http://example.com

  2. Access-Control-Allow-Methods

    • 含义：指示允许的 HTTP 方法（用于 CORS）。
    • 常见值：GET, POST, PUT, DELETE

  3. Access-Control-Allow-Headers

    • 含义：指示允许的请求头（用于 CORS）。
    • 常见值：Content-Type, Authorization

  4. Access-Control-Expose-Headers

    • 含义：指示哪些响应头可以被客户端访问（用于 CORS）。
    • 常见值：Content-Length, X-Custom-Header

  5. Age

    • 含义：指示响应在缓存中的时间（以秒为单位）。
    • 常见值：123

  6. Cache-Control

    • 含义：指示缓存机制如何处理响应。
    • 常见值：no-cache, no-store, max-age=<seconds>, must-revalidate, public, private

  7. Content-Disposition

    • 含义：指示如何处理响应内容（例如下载文件）。
    • 常见值：inline, attachment; filename="filename.txt"

  8. Content-Encoding

    • 含义：指示响应内容的编码方式。
    • 常见值：gzip, deflate, br

  9. Content-Language

    • 含义：指示响应内容的语言。
    • 常见值：en-US, zh-CN

  10. Content-Length

    • 含义：表示响应体的长度（以字节为单位）。
    • 常见值：123

  11. Content-Type

    • 含义：表示响应体的媒体类型。
    • 常见值：text/html, application/json, application/xml, image/jpeg, application/pdf

  12. Date

    • 含义：指示响应生成的日期和时间。
    • 常见值：Wed, 21 Oct 2015 07:28:00 GMT

  13. ETag

    • 含义：指示资源的唯一标识符，用于缓存验证。
    • 常见值：W/"644b5b3c2974d80e68a067c5"

  14. Expires

    • 含义：指示响应的过期时间。
    • 常见值：Wed, 21 Oct 2015 07:28:00 GMT

  15. Last-Modified

    • 含义：指示资源的最后修改时间。
    • 常见值：Wed, 21 Oct 2015 07:28:00 GMT

  16. Location

    • 含义：指示重定向的 URL。
    • 常见值：http://example.com/new-page

  17. Pragma

    • 含义：用于向后兼容 HTTP/1.0 缓存控制。
    • 常见值：no-cache

  18. Proxy-Authenticate

    • 含义：指示代理服务器的认证信息。
    • 常见值：Basic realm="example"

  19. Retry-After

    • 含义：指示客户端在多长时间后重试请求。
    • 常见值：3600、Wed, 21 Oct 2015 07:28:00 GMT

  20. Server

    • 含义：指示服务器的软件信息。
    • 常见值：Apache/2.4.41 (Ubuntu)、nginx/1.18.0

  21. Set-Cookie

    • 含义：指示设置的 cookie 信息。
    • 常见值：session=abc123; Path=/; HttpOnly、user=JohnDoe; Path=/; Secure

  22. Strict-Transport-Security

    • 含义：指示浏览器在多长时间内只使用 HTTPS 访问该站点。
    • 常见值：max-age=31536000; includeSubDomains

  23. Transfer-Encoding

    • 含义：指示响应内容的传输编码方式。
    • 常见值：chunked

  24. Vary

    • 含义：指示缓存机制在缓存响应时应考虑的请求头。
    • 常见值：Accept-Encoding、User-Agent

  25. WWW-Authenticate

    • 含义：指示客户端的认证信息。
    • 常见值：Basic realm="example"、Bearer realm="example"

  26. X-Content-Type-Options

    • 含义：指示浏览器是否应遵循 Content-Type 头。
    • 常见值：nosniff

  27. X-Frame-Options

    • 含义：指示是否允许页面在 <frame>、<iframe>、<embed> 或 <object> 中显示。
    • 常见值：DENY、SAMEORIGIN、ALLOW-FROM http://example.com

  28. X-XSS-Protection

    • 含义：指示浏览器是否应启用 XSS 过滤。
    • 常见值：1; mode=block、0

  29. Content-Security-Policy

    • 含义：指示内容安全策略，用于防止 XSS 和其他注入攻击。
    • 常见值：default-src 'self'、script-src 'self' https://example.com

  30. Referrer-Policy

    • 含义：指示 Referer 头的策略。
    • 常见值：no-referrer、no-referrer-when-downgrade、origin、origin-when-cross-origin、same-origin、strict-origin、strict-origin-when-cross-origin、unsafe-url

  31. Accept-Ranges

    • 含义：指示服务器是否支持范围请求。
    • 常见值：bytes、none

  32. Content-Range

    • 含义：指示响应内容的范围。
    • 常见值：bytes 0-1023/10240

  33. Content-Security-Policy-Report-Only

    • 含义：指示内容安全策略报告模式，用于测试 CSP 而不强制执行。
    • 常见值：default-src 'self'; report-uri /csp-report-endpoint/

  34. Expect-CT

    • 含义：指示客户端是否应启用证书透明度（CT）。
    • 常见值：max-age=31536000; enforce

  35. Feature-Policy（或 Permissions-Policy）

    • 含义：指示浏览器是否应启用某些功能。
    • 常见值：geolocation 'none'、camera 'self'

  36. Link

    • 含义：指示资源的链接关系。
    • 常见值：<http://example.com>; rel="next"、<http://example.com>; rel="prev"

  37. Public-Key-Pins（或 Public-Key-Pins-Report-Only）

    • 含义：指示公钥固定（HPKP）策略。
    • 常见值：pin-sha256="base64=="; max-age=2592000; includeSubDomains

  38. Timing-Allow-Origin

    • 含义：指示是否允许跨域资源的性能测量。
    • 常见值：*、http://example.com

  39. X-Download-Options

    • 含义：指示是否允许下载内容的执行。
    • 常见值：noopen

  40. X-Content-Duration

    • 含义：指示媒体内容的持续时间。
    • 常见值：123.45

Network 面板中常见术语

序号 功能 作用描述
1 Open in Sources panel 将选中的资源在Sources面板中打开，方便查看和编辑源代码。
2 Open in new tab 在新标签页中打开选中的资源，可以更详细地查看该资源的内容。
3 Clear browser cache 清除浏览器缓存，这有助于解决因缓存导致的页面显示问题。
4 Clear browser cookies 清除浏览器的Cookies，Cookies通常用于存储用户的登录状态、偏好设置等信息。
5 Copy 复制选中的资源的相关信息，如URL、Headers等。
6 Block request URL 阻止特定的URL请求，防止该资源被加载，常用于排除某些资源对页面的影响。
7 Block request domain 阻止特定域名下的所有请求，防止该域名下的资源被加载。
8 Sort by 按不同的标准排序网络请求，如时间、大小等，便于分析。
9 Header Options 提供对请求头（Headers）的更多操作选项。
10 Override headers 覆盖请求头，允许你自定义请求头的内容，用于测试不同的请求条件。
11 Override content 覆盖响应内容，允许你修改服务器返回的内容，用于模拟不同的响应情况。
12 Show all overrides 显示所有已设置的覆盖项，方便管理和查看。
13 Save all as HAR with content 将所有网络请求保存为HAR文件，包括请求和响应的内容，便于离线分析或分享。
14 Save as... 将选中的资源另存为文件，可以保存到本地进行进一步处理。

序号 选项名称 描述说明
1 Copy link address 复制该请求的 URL 地址。
2 Copy response 复制服务器返回的响应内容（即响应体）。
3 Copy as PowerShell 将该请求转换为 PowerShell 命令格式并复制，可在 Windows PowerShell 中执行。
4 Copy as fetch 将该请求转换为 JavaScript 的 fetch 函数调用格式，可在浏览器控制台或其他 JS 环境中运行。
5 Copy as Node.js fetch 将该请求转换为适用于 Node.js 环境的 fetch 调用格式。
6 Copy as cURL (cmd) 将该请求转换为 Windows 命令行下的 cURL 命令格式并复制。
7 Copy as cURL (bash) 将该请求转换为 Linux/Unix shell 下的 cURL 命令格式并复制。
8 Copy all as PowerShell 将所有网络请求批量转换为 PowerShell 命令并复制。
9 Copy all as fetch 将所有请求批量转换为 JavaScript 的 fetch 调用并复制。
10 Copy all as Node.js fetch 将所有请求批量转换为适用于 Node.js 环境的 fetch 调用并复制。
11 Copy all as cURL (cmd) 将所有请求批量转换为 Windows 下的多个 cURL 命令并复制。
12 Copy all as cURL (bash) 将所有请求批量转换为 Linux/Unix 下的多个 cURL 命令并复制。
13 Copy all as HAR 将所有网络请求保存为 HAR（HTTP Archive）格式并复制，可用于离线分析或与其他开发者共享完整的请求记录。

序号 列名 描述说明
1 Name 请求资源的名称（通常是文件名或路径）。
2 Path 请求资源在服务器上的路径。
3 Url 请求资源的完整 URL 地址。
4 Method HTTP 请求方法，如 GET、POST 等。
5 Status HTTP 响应状态码，如 200（成功）、404（未找到）等。
6 Protocol 使用的协议版本，如 HTTP/1.1、HTTP/2、SPDY 等。
7 Scheme URL 的协议方案，如 http 或 https。
8 Domain 请求资源所在的域名（主机名）。
9 Remote Address 远程服务器的 IP 地址和端口号。
10 Remote Address Space 远程地址所属的网络空间分类（如公网、本地、私有等）。
11 Type 请求资源的类型，如 document、script、image、stylesheet 等。
12 Initiator 发起该请求的来源（如哪个脚本、页面元素触发了这个请求）。
13 Initiator Address Space 发起者的地址空间分类。
14 Cookies 请求头中携带的 Cookie 信息。
15 Set Cookies 响应头中设置的 Cookie 信息。
16 Size 请求和响应内容的总大小（包括头部和正文）。
17 Time 该请求从开始到完成所花费的时间（通常以毫秒为单位）。
18 Priority 浏览器对该请求的加载优先级（如 high、medium、low）。
19 Connection ID 与服务器建立连接的唯一标识符。
20 Has overrides 表示该请求是否应用了覆盖（override），例如修改了请求头或响应内容。
21 Reset Columns 恢复列显示为默认设置。
22 Response Headers 显示服务器返回的响应头信息。
23 Waterfall 显示请求的时间线瀑布图，用于分析加载性能。

📊 浏览器 Network 面板常见功能与状态说明表

序号 术语 / 功能名称 含义说明
1 Blocked response cookies 表示服务器尝试在响应头中设置 Cookie（通过 Set-Cookie），但该 Cookie 被浏览器根据安全策略（如 SameSite、跨域限制等）拒绝接收。例如：<br>- 第三方 Cookie 被浏览器阻止；<br>- SameSite=Strict/Lax 的请求未满足条件；<br>这些 Cookie 不会被存储，也不会随后续请求发送。
2 Blocked request 表示该网络请求被浏览器基于某些安全策略主动拦截或阻止。可能原因包括：<br>- 混合内容（HTTPS 页面加载 HTTP 资源）；<br>- CORS 策略限制；<br>- CSP（内容安全策略）规则限制；<br>- 用户安装的广告/脚本拦截插件；<br>- 扩展程序或企业策略干预。<br>通常会在面板中标记为红色或显示“Blocked”状态。
3 3-rd-party-request 表示该请求的目标域名与当前网页主域名不同，属于第三方资源请求。例如：<br>- 在访问 example.com 时，加载了来自 ads.example.net 或 analytics.otherdomain.com 的资源；<br>常用于广告、统计、社交组件等。<br>受 SameSite、CSP、Cookie 策略影响较大，容易被浏览器限制或阻止。
4 Hide data URLs 当启用此选项时，浏览器会隐藏使用 data: 协议的请求（即内联资源）。例如：Base64 编码的图片直接嵌入 HTML/CSS 中。<br>这些资源不触发实际 HTTP 请求，有时为了专注于外部资源加载分析，可以选择隐藏它们。
5 Hide extension URLs 启用后，浏览器会隐藏所有由浏览器扩展发起的网络请求。例如：广告拦截插件、翻译插件等可能会注入脚本并发起请求。<br>如果你只想查看网站本身的网络活动，而不是扩展的行为，可开启此选项以减少干扰。
6 Invert 反转当前的过滤规则。例如：<br>- 如果你设置了只显示图片请求（如 .jpg, .png）；<br>- 再点击 “Invert”，则会显示除了图片之外的所有请求；<br>提供一种快速查看“非匹配项”的方式，便于灵活筛选网络请求数据。

✅ 用途总结：

类型 示例功能/状态 主要用途/作用
状态类 Blocked response cookies 查看哪些 Cookie 被浏览器阻止
  Blocked request 分析哪些请求被浏览器出于安全原因拦截
  3-rd-party-request 区分主站请求与第三方请求，帮助排查隐私、性能、安全性问题
过滤控制类 Hide data URLs 隐藏内联资源，专注于真实网络请求
  Hide extension URLs 过滤掉扩展发起的请求，专注于网站本身发出的请求
  Invert 快速切换过滤逻辑，查看“不符合当前筛选条件”的请求

 

网站公告

今日签到

点亮在社区的每一天
去签到

热门文章

最新发布