使用协议监视器查看 DevTools 发出的所有 CDP 请求和响应,并直接发送 CDP 命令。
概览
Chrome 开发者工具使用 Chrome DevTools Protocol (CDP) 来插桩、检查、调试和分析 Chrome 浏览器。开发者可以使用协议监视器以编程方式与 CDP 进行交互。
借助协议监视器,您可以执行以下操作:
- 记录 CDP 请求和响应
- 检查 CDP 消息
- 保存 CDP 消息
- 发送 CDP 命令
打开协议监视器
如需打开协议监视器,请按以下步骤操作:
确保实验已启用。依次选择 Settings
> Experiments,然后勾选 Protocol Monitor 复选框。按以下任一键打开命令菜单:
- macOS:Command+Shift+P
- Windows、Linux、ChromeOS:Ctrl+Shift+P
开始输入
Protocol monitor
,选择 Show Protocol monitor,然后按 Enter 键。开发者工具会在开发者工具窗口底部显示协议监视器面板。
或者,在右上角,依次选择
更多选项 > 更多工具 > 协议监视器。记录 CDP 请求和响应
当您打开协议监视器时,它会自动开始录制当前网页中的 CDP 消息。即使您刷新页面或关闭 DevTools,协议监视器也会继续录制。
如需停止或开始录制,请点击面板顶部操作栏左侧的录制按钮。
检查 CDP 消息
协议监视器记录 CDP 消息后,这些消息会记录在面板左侧的表格中。
点击某个 Method(方法)、Request(请求)或 Response(响应)单元格,即可在面板右侧打开其 Request 或 Response 数据的详细视图。
点击相应的标头标签页,即可在请求或响应数据之间切换。
右键点击“方法”列中的值可显示基于上下文的选项。
清除和下载 CDP 消息
如需清除所有已记录的 CDP 消息,请点击操作栏中的清除
按钮。如需将录制的邮件下载为 JSON 文件,请点击“下载”图标
。发送原始 CDP 命令
通过协议监视器发送 CDP 命令主要有两种方式:
如果命令不需要任何参数,请在 Protocol Monitor(协议监视器)底部的输入字段中输入该命令,然后按 Enter 键,例如
Page.captureScreenshot
。如果命令需要参数,请以 JSON 格式提供这些参数,例如
{"cmd":"Page.captureScreenshot","args":{"format": "jpeg"}}
。输入字段右侧的下拉菜单用于指定目标。
您还可以使用 CDP 编辑器修改和发出命令:
- 点击命令输入字段旁边的 显示 CDP 命令编辑器按钮,打开命令编辑器。
- 从下拉列表中选择一个目标,然后在命令提示旁边开始输入 CDP 命令。自动补全功能会为您提供相关选项。选择您要使用的命令。
- 您输入 CDP 命令后,编辑器会根据协议定义创建结构化形式的参数。填写这些参数,以便随命令一起发送。
- 点击 发送命令按钮或按 Ctrl + Enter 发送命令。
您还可以修改和重新发送表格中的命令。右键点击表格中的某个项目,然后从下拉菜单中选择“修改并重新发送”。这会自动重新打开 CDP 编辑器,并使用您选择的命令预先填充该编辑器。
如需详细了解 CDP 编辑器,请参阅使用新的命令编辑器高效编写 Chrome 开发者工具协议 (CDP) 命令。