edge
通过 CDP (Chrome DevTools Protocol) 连接用户的 Edge 浏览器,利用现有的登录会话、Cookie 和保存的密码进行自动化操作。使用场景:(1) 用户希望在 Edge 中使用现有登录状态自动执行任务,(2) 网站需要登录/CAPTCHA 但用户已在 Edge 中解决,(3) 用户明确提到使用 Edge 浏览器,(4) 需要通过使用现有浏览器会话来绕过身份验证。
Best use case
edge is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
通过 CDP (Chrome DevTools Protocol) 连接用户的 Edge 浏览器,利用现有的登录会话、Cookie 和保存的密码进行自动化操作。使用场景:(1) 用户希望在 Edge 中使用现有登录状态自动执行任务,(2) 网站需要登录/CAPTCHA 但用户已在 Edge 中解决,(3) 用户明确提到使用 Edge 浏览器,(4) 需要通过使用现有浏览器会话来绕过身份验证。
Teams using edge should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/edge/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How edge Compares
| Feature / Agent | edge | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
通过 CDP (Chrome DevTools Protocol) 连接用户的 Edge 浏览器,利用现有的登录会话、Cookie 和保存的密码进行自动化操作。使用场景:(1) 用户希望在 Edge 中使用现有登录状态自动执行任务,(2) 网站需要登录/CAPTCHA 但用户已在 Edge 中解决,(3) 用户明确提到使用 Edge 浏览器,(4) 需要通过使用现有浏览器会话来绕过身份验证。
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
## Important
* 禁止关闭现有 Edge 进程
* 应当使用 Edge,禁止使用 Chrome
## Workflow
1. 检查 Edge Chrome Devtools 端口是否正常运行
```bash
curl -s http://localhost:9333/json/version
# success response example
# {
# "Browser": "Edg/145.0.3800.97",
# "Protocol-Version": "1.3",
# "User-Agent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/145.0.0.0 Safari/537.36 Edg/145.0.0.0",
# "V8-Version": "14.5.40.9",
# "WebKit-Version": "537.36 (@f4c49d5241f148220b99eb7f045ac370a1694a15)",
# "webSocketDebuggerUrl": "ws://localhost:9333/devtools/browser/d384a2e4-8bc0-4a1a-8f98-e7325d4ea55c"
# }
```
返回空或0,则表示 9333 没有运行。
如果返回结果显示 9333 端口正常运行,接下来直接使用 `chrome-devtools` 或 MCP 工具完成用户的需求,不必关心后续 prepare env 等步骤。
open a edge instance:
```bash
nohup /Applications/Microsoft\ Edge.app/Contents/MacOS/Microsoft\ Edge \
--remote-allow-origins=http://localhost:9333 \
--remote-debugging-port=9333
```
## 技术细节
### Origin 匹配
当通过 WebSocket 连接 CDP 时,**必须**设置与 Edge 启动参数 `--remote-allow-origins` 匹配的 Origin header,否则会收到 403 Forbidden 错误:
```
Handshake status 403 Forbidden -+-+- ...
Rejected an incoming WebSocket connection from the http://localhost:9333 origin.
```
**正确的连接方式:**
```python
import websockets
headers = {"Origin": "http://localhost:9333"}
ws_url = "ws://localhost:9333/devtools/page/<page-id>"
async with websockets.connect(ws_url, additional_headers=headers) as ws:
# 连接成功
```
注意:Edge 启动时使用的是 `--remote-allow-origins=http://localhost:9333`,不是 `localhost`,所以 WebSocket 连接时也必须使用 `localhost` 作为 origin。
### CDP 消息队列处理
Chrome DevTools Protocol 是异步的,消息可能不会按发送顺序返回。需要正确处理消息队列:
```python
# 错误:假设响应按发送顺序返回
await ws.send(json.dumps({"id": 1, "method": "Page.enable"}))
await ws.send(json.dumps({"id": 2, "method": "Runtime.enable"}))
resp1 = await ws.recv() # 可能是 id=2 的响应!
resp2 = await ws.recv()
# 正确:通过 id 匹配响应
await ws.send(json.dumps({"id": 1, "method": "Page.enable"}))
await ws.send(json.dumps({"id": 2, "method": "Runtime.enable"}))
responses = {}
for expected_id in [1, 2]:
msg = json.loads(await ws.recv())
if "id" in msg:
responses[msg["id"]] = msg
# 处理特定 id 的响应
while True:
msg = json.loads(await ws.recv())
if msg.get("id") == 4: # 等待 id=4 的响应
result = msg
break
```
常见的事件(非响应型)消息包括:
- `Page.loadEventFired` - 页面加载完成
- `Page.frameStoppedLoading` - 框架停止加载
- `Runtime.executionContextCreated` - 执行上下文创建
这些事件没有 `id` 字段,需要与带 `id` 的命令响应区分开来。Related Skills
open-u-dashboard
open understand dashboard for user
sync-template-skill
这是一个技能文件的模板,展示了技能的基本结构和内容组织方式。
talk-humanize
Be direct and informative. No filler, no fluff, but give enough to be useful.
search-web
使用 Evaluator-optimizer 模式进行系统性多轮网络搜索,采用结构化 Ask 流程在搜索前澄清研究目标。基于 YC Office Hours 的提问方法论,确保搜索方向清晰、结果可验证。当用户需要深入调查复杂主题、验证假设或全面收集信息时使用。
save-to-eagle
归档网络内容到 Eagle 素材库。支持:(1) Behance/Pixiv 图片归档,(2) 网页视频录制(页面动画、滚动录制)。使用方式:'归档 [URL]' 归档图片;'录制网页视频 [URL]' 录制页面动画;'滚动录制 [URL]' 自动滚动截图。支持评分如 '归档 [URL], 3/5'。
save-ob-chaos
将对话内容快速存档到 Obsidian Chaos 文件夹。触发词:"存档到 Obsidian"、"保存到 Chaos"、"ob 存档"、"记下这个"、"保存这段内容"、"存到 chaos"。
save-ob-chaos-mermaid
将 Mermaid 图表保存到 Obsidian Chaos 文件夹。触发词:"保存 mermaid 到 chaos"、"mermaid 存档"。
save-ob-chaos-excalidraw
绘制 Excalidraw 图表并存档到 Obsidian Chaos 文件夹。触发词:"画个图存到 Obsidian"、"excalidraw 存档"、"画个流程图保存"、"画图存到 chaos"、"创建图表并存档"、"画架构图到 ob"。
release-project
项目版本发布流程指导,帮助用户完成版本规划、Changelog 管理、版本号升级、Git 标签创建和 npm 首次发布准备。Use when: (1) 用户需要发布新版本 (2) 需要创建版本发布流程 (3) 需要管理版本号和 Changelog (4) 需要自动化版本发布 (5) 需要检查 release 分支同步 (6) 首次 npm 发布准备
recognize-codebase-branch-flow
识别并记忆项目 git 分支模型
rebase-commits
将零散的 commits 整合为清晰的逻辑提交,使 Git 历史更易读。 Use when: (1) 用户说 "rebase commits"、"整理提交历史"、"让历史更干净" (2) 用户想将多个相关 commits 合并为逻辑单元 (3) 完成一个功能后需要清理 commit 历史 (4) 提交历史混乱,需要重新组织
read-codebase
阅读棕地项目代码库,智能分析代码结构,递归补充其调用链上所有函数的注释。