🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
[TOC] > [DevTools 协议手册](https://chromedevtools.github.io/devtools-protocol/1-3/) ## 概述 ## 常用浏览器地址 通过调试端口加上 地址可显示相关信息 ### /json/protocol 可以列举出所有的协议指令 ### /json/version 版本信息 ``` { "Browser": "Chrome/78.0.3882.0", "Protocol-Version": "1.3", "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3882.0 Safari/537.36", "V8-Version": "7.8.89", "WebKit-Version": "537.36 (@19d4547535ab5aba70b4730443f84e8153052174)", "webSocketDebuggerUrl": "ws://127.0.0.1:51965/devtools/browser/e92af78f-a5a1-47e6-9234-ace969a46773" } ``` ### /json 或 /json/list 所有可用的WebSocket目标的列表。 ``` [ { "description": "", "devtoolsFrontendUrl": "/devtools/inspector.html?ws=127.0.0.1:51965/devtools/page/C1E29F75CD3D130BC7FC39417BBDA934", "faviconUrl": "https://lf3-cdn-tos.bytescm.com/obj/static/xitu_juejin_web/static/favicons/favicon-32x32.png", "id": "C1E29F75CD3D130BC7FC39417BBDA934", "title": "稀土掘金", "type": "page", "url": "https://juejin.cn/", "webSocketDebuggerUrl": "ws://127.0.0.1:51965/devtools/page/C1E29F75CD3D130BC7FC39417BBDA934" } ] ``` ### /json/new?{url} 用url打开一个新表情作为目标 ### /json/activate/{targetId} 激活一个选项卡 `targetId`为`/json` 中的ID字段 返回`Target activated` 表示激活成功 ### /json/close/{targetId} 关闭 targetid 的目标页 ### WebSocket 方式连接 /devtools/page/{targetId} 用于websocket 的连接 ## 常用接口 1. **Page 协议:** 用于与页面相关的操作,例如导航、截图、执行 JavaScript 等。 * `Page.navigate`:导航到指定 URL。 * `Page.reload`:重新加载页面。 * `Page.captureScreenshot`:截取页面的屏幕截图。 * `Page.evaluate`:执行 JavaScript 代码在页面上下文中。 2. **DOM 协议:** 用于访问和操作页面的文档对象模型(DOM)元素。 * `DOM.getDocument`:获取文档的根节点。 * `DOM.querySelector` 和 `DOM.querySelectorAll`:根据选择器查找 DOM 元素。 * `DOM.setAttributeValue` 和 `DOM.removeAttribute`:设置或移除元素的属性值。 * `DOM.focus`:聚焦到指定元素。 3. **Runtime 协议:** 用于在页面上执行 JavaScript 代码。 * `Runtime.evaluate`:在页面上下文中执行 JavaScript 代码并返回结果。 * `Runtime.callFunctionOn`:调用页面上下文中的函数。 * `Runtime.compileScript`:编译 JavaScript 脚本以供稍后执行。 4. **Network 协议:** 用于监控和控制网络请求。 * `Network.enable` 和 `Network.disable`:启用和禁用网络事件捕获。 * `Network.setRequestInterception`:拦截网络请求并进行修改或阻止。 * `Network.getResponseBody`:获取响应体内容。 * `Network.requestWillBeSent` 和 `Network.responseReceived`:网络请求和响应事件。 5. **Console 协议:** 用于处理页面上的控制台消息。 * `Console.enable` 和 `Console.disable`:启用和禁用控制台事件捕获。 * `Console.clearMessages`:清除控制台消息。 * `Console.messageAdded`:当页面上有新的控制台消息时触发的事件。 6. **Security 协议:** 用于处理页面的安全性信息。 * `Security.enable` 和 `Security.disable`:启用和禁用安全事件捕获。 * `Security.getCertificate`:获取网站的 SSL 证书信息。 * `Security.securityStateChanged`:安全状态更改事件。 7. **Target 协议:** 用于管理和控制浏览器目标,例如页面和服务工作线程。 * `Target.createTarget`:创建新的浏览器目标。 * `Target.attachToTarget`:附加到现有的浏览器目标。 * `Target.closeTarget`:关闭浏览器目标。