登录
推荐 文章 Go 技术 课程 下载 专题 AI
首页 >  文章 >  软件教程

Chrome DevTools 怎样复制带请求头的网络请求

来源:17golang原创

时间:2026-10-18 11:32:19 317浏览 收藏

在 Chrome DevTools 的 Network 面板中,右键目标请求所在的 Name 行,选择 Copy > Copy as cURL,即可把请求转换为带请求参数的命令文本。只点 Copy URL 得到的是地址,不是包含请求头和请求体的完整调试材料。

官方帮助入口:https://developer.chrome.com/docs/devtools/network/。本文只处理你有权调试的页面,最终把单条请求保存为文本,不要求重发请求。图片均为 ImageGen 原创操作示意图,不是真实浏览器截图,也不表示已执行图中的请求。

1. 先捕获一次明确的测试请求

在桌面 Chrome 打开自己的测试页面,打开开发者工具后点击 Network。Windows、Linux 可先按 Ctrl+Shift+J,macOS 可先按 Command+Option+J,再从 Console 切换到 Network。确认左上角录制按钮处于启用状态,然后触发一次只读查询。

例如在你自己的练习页面查询“设计规范”,目标请求约定为 https://example.invalid/api/search?q=design。这是不可用于真实服务的虚构示例地址,不要访问它。实际操作使用自己环境中的地址。请求列表出现新行才继续;打开工具前发生的旧请求,不会自动补录。

如列表过多,可用过滤栏输入路径片段 api/search,但过滤只是缩小显示范围,仍要选对那一条。不要为了教学重新提交订单、付款或删除操作。刷新页面可能重新加载数据,应先确认测试环境允许。

Network 面板启用录制并显示 search 请求,过滤栏为 api/search
图1:入口与捕获操作示意图;请求表出现对应行后再进行复制。

2. 对照 Headers,确认复制的是哪条请求

点击目标行,打开详情中的 Headers,在 General 看 URL 和 Request Method,再看 Request Headers。不要把 Response Headers 当作要发出的请求头:前者描述客户端发送的字段,后者属于服务端返回的数据。

假设练习请求是 GET,查询词应在 URL 的查询参数中;若你处理的是有正文的请求,再切到 Payload 看提交内容。本篇不要求为了获得请求体而把 GET 改成 POST,也不要求手工添加任何身份字段。

继续前至少确定“地址、方法、所选行”是一致的。相同路径可能出现多次;选中的也可能是重定向链的一段或 OPTIONS 预检,不要仅凭 Name 相似就判断选对。如果面板提示 Provisional headers are shown,不能把暂列的头部视为完整的实际上网记录。

选中的 search 行打开 Headers,General 与 Request Headers 分区清楚,示例 Accept 为 application/json
图2:请求详情操作示意图;区分 General、Request Headers 和 Response Headers。

3. 从单条请求的 Copy 子菜单导出

回到该请求的 Name 单元格,右键,展开 Copy,选择 Copy as cURL。若当前界面细分为 bash、cmd 等目标格式,按以后实际使用的 shell 选择;菜单名称随版本和平台可能略有差异。Windows 的 cmd 转义与 bash 不相同,不能只改一处换行符就认为可以跨 shell 执行。

这里选的是单条请求,不是 Copy all as cURL 或带 all listed 的批量选项。也不要点 Copy response:那份结果是响应正文。复制操作的目标是剪贴板文本;本轮到这里不需要点击 Replay XHR,也不需要使用 Edit and resend as fetch。

所需材料选择得到的内容
仅记录接口地址Copy URLURL 文本
保留单次请求参数Copy as cURL可供检查的请求命令
记录返回数据Copy response响应正文,不等同于请求
Network 请求行右键 Copy 子菜单展开并突出 Copy as cURL,Copy URL 和 Copy response 为其他选项
图3:复制操作示意图;选择单条请求命令,不复制整批请求或响应正文。

4. 先粘贴为文本,再保存需要的副本

把剪贴板内容粘贴到本地纯文本草稿,先不要放进终端、Console 或会自动执行导入内容的工具。对照第2步所选行,辨认命令中的 URL、方法、请求头以及可能的数据参数。cURL 中 -H 或 --header 用来提供请求头;不同导出结果可能使用不同参数,不要要求每个头都必须长成相同形式。

下面是人工精简的 bash 格式教学文本,不是 DevTools 的逐字导出,不含真实凭据,也没有执行过:

# 仅展示 URL 与请求头的对应关系;示例域名不提供真实接口
curl 'https://example.invalid/api/search?q=design' \
  -H 'Accept: application/json'

这个命令没有指定其他方法或上传数据时使用 GET。真实复制结果若包含数据参数,要保留它们与方法的组合关系,不能为了让文本变短而随意删掉请求体。复制文本并不保证之后重放一定成功:会话、临时签名和业务状态都可能发生变化;浏览器上下文也不等同于命令行环境。

保存前检查 URL 查询参数、请求体、Cookie、Authorization 和其他自定义身份头。不要把真实会话值贴进公开工单、聊天或代码仓库。用于交流的副本可替换为清楚标注的占位说明,并明确它已经不可直接复现;真正需要受限保存的原件只留在获授权的位置。不要因为导出菜单另有 sanitized HAR 选项,就推断 cURL 剪贴板文本也已自动脱敏。

原创本地纯文本草稿窗口展示虚构域名的 curl 文本、Accept 请求头和未执行的说明
图4:复制结果示意图;纯文本中辨认请求结构,不在终端里直接粘贴执行。

最后将这份材料命名为“查询请求-脱敏说明”,记录来源页面、复制时间及目标 shell。文件扩展名用 .txt,避免把用于交流的内容误作脚本运行。若结果只有一行地址,重新选择 Copy as cURL;若包含多条 curl 命令,检查是否误用了批量菜单。完成标准是得到可辨认、经过必要脱敏的单次请求文本,而不是向服务端多发一次请求。

相关官方资料

Network 的复制与请求详情功能:https://developer.chrome.com/docs/devtools/network/reference/

cURL 参数含义:https://curl.se/docs/manpage.html

声明:本文转载于:17golang原创 如有侵犯,请联系study_golang@163.com删除
相关阅读
更多>
最新阅读
更多>
课程推荐
更多>