360 Secure SkillHub
360 安全技能中心

网页自动操作

该 Skill 提供一套 Node 命令行工具,用于自动化浏览器交互:打开网址、获取可交互元素快照、按元素引用或语义定位器点击与填写表单、截图、读写 cookies 与 localStorage、管理标签页窗口及处理对话框,适用于网页测试与数据提取。

2020必胜
2020必胜
热度 35.50
最近更新 2026-04-02 20:52:51
分类:自动化依赖:代码执行 / 联网浏览搜索 / 读写文件应用场景:自动化脚本 / 工作流

安装技能

复制下面的话术发给你的 Agent,它会通过 secure-skills 检索并安装该技能。

执行命令安装此 skill: npx secure-skills-cli add 360browser-agent
Metadata
name
360browser_agent
description
自动处理浏览器交互操作,用于网页测试、表单填写、截图以及数据提取。当用户需要浏览网站、与网页进行交互、填写表单、截取屏幕截图、测试网页应用程序或从网页中提取信息时,可使用此功能。
trigger_keywords
["浏览器操作"]
when_to_use
当用户需要浏览网站、与网页进行交互、填写表单、截取屏幕截图、测试网页应用程序或从网页中提取信息时使用。
auto_trigger
true
allowed_tools
["open","back","forward","reload","close","snapshot","screenshot","click","dblclick","focus","fill","type","press","keydown","keyup","hover","check","uncheck","select","scroll","scrollintoview","get text","get html","get value","get attribute","get styles","get box","get title","get url","get count","is visible","is enabled","is checked","wait","find","cookies","storage","tab","window","dialog","eval"]
version
1.0.0
author
System
tags
["浏览器","浏览器操作","浏览器自动化","浏览器操作技能"]
cn-name
浏览器自动化-skill

浏览器自动化-skill

用于自动化浏览器交互操作的 skill,支持网页测试、表单填写、截图以及数据提取。

可用工具

工具 说明
open 打开指定 URL 的网页
back 返回上一页
forward 前进到下一页
reload 重新加载页面
close 关闭浏览器
snapshot 获取页面交互元素快照,返回带引用的元素列表
screenshot 截取当前页面的屏幕截图
click 点击指定的元素
dblclick 双击指定的元素
focus 聚焦指定的元素
fill 清空并输入文本到指定元素
type 不清空直接输入文本到指定元素
press 按下按键或组合键
keydown 按住按键
keyup 释放按键
hover 鼠标悬停在指定元素上
check 勾选复选框
uncheck 取消勾选复选框
select 在下拉列表中选择指定的选项
scroll 滚动页面到指定位置
scrollintoview 滚动元素至可见区域
wait 等待指定的条件(元素、文本、URL、网络空闲等)
get text 获取指定元素的文本内容
get html 获取指定元素的 innerHTML
get value 获取指定元素的输入值
get attribute 获取指定元素的属性值
get styles 获取指定元素的计算样式
get box 获取元素的边界框位置和尺寸
get title 获取当前页面的标题
get url 获取当前页面的 URL
get count 计算匹配元素数量
is visible 检查元素是否可见
is enabled 检查元素是否启用
is checked 检查元素是否被选中
find 使用语义定位器查找元素并执行操作
cookies 获取、设置或清除 cookies
storage 操作 localStorage
tab 管理标签页(列出、新建、切换、关闭)
window 管理浏览器窗口
dialog 处理对话框(接受或取消)
eval 执行 JavaScript 代码

核心工作流

1. 浏览器自动化流程

步骤 1: open <url>                     # 导航到目标网页
步骤 2: snapshot -i                     # 获取可交互元素快照(推荐使用)
步骤 3: 使用 snapshot 返回的 @e1、@e2 等引用进行交互操作
步骤 4: 在页面导航或 DOM 发生重大变化后,重新执行 snapshot

2. 导航

node scripts/360browser_agent.mjs open <url>      # 导航到 URL(别名:goto, navigate)
                              # 支持:https://, http://, file://, about:, data://
                              # 如果没有协议,自动添加 https://
node scripts/360browser_agent.mjs back            # 返回上一页
node scripts/360browser_agent.mjs forward         # 前进到下一页
node scripts/360browser_agent.mjs reload          # 重新加载页面
node scripts/360browser_agent.mjs close           # 关闭浏览器(别名:quit, exit)

3. 页面分析(快照)

node scripts/360browser_agent.mjs snapshot            # 获取完整的可访问性树
node scripts/360browser_agent.mjs snapshot -i         # 仅获取可交互元素(推荐)
node scripts/360browser_agent.mjs snapshot -c         # 紧凑输出模式
node scripts/360browser_agent.mjs snapshot -d 3       # 限制深度为 3
node scripts/360browser_agent.mjs snapshot -s "#main" # 限定 CSS 选择器范围

4. 交互操作(使用 snapshot 返回的 @refs)

node scripts/360browser_agent.mjs click @e1           # 点击元素
node scripts/360browser_agent.mjs dblclick @e1        # 双击元素
node scripts/360browser_agent.mjs focus @e1           # 聚焦元素
node scripts/360browser_agent.mjs fill @e2 "text"     # 清空并输入文本
node scripts/360browser_agent.mjs type @e2 "text"     # 不清空直接输入文本
node scripts/360browser_agent.mjs press Enter         # 按下按键(别名:key)
node scripts/360browser_agent.mjs press Ctrl+a        # 按下组合键
node scripts/360browser_agent.mjs keydown Shift       # 按住键
node scripts/360browser_agent.mjs keyup Shift         # 释放键
node scripts/360browser_agent.mjs hover @e1           # 鼠标悬停
node scripts/360browser_agent.mjs check @e1           # 勾选复选框
node scripts/360browser_agent.mjs uncheck @e1         # 取消勾选复选框
node scripts/360browser_agent.mjs select @e1 "value"  # 选择下拉选项
node scripts/360browser_agent.mjs select @e1 "a" "b"  # 选择多个选项
node scripts/360browser_agent.mjs scroll down 500     # 滚动页面(默认:向下 300px)
node scripts/360browser_agent.mjs scrollintoview @e1  # 滚动元素至可见区域(别名:scrollinto)

5. 获取信息

5.1 元素内容获取

node scripts/360browser_agent.mjs get text @e1        # 获取元素文本内容
node scripts/360browser_agent.mjs get html @e1        # 获取元素的 innerHTML
node scripts/360browser_agent.mjs get value @e1       # 获取表单元素的输入值

5.2 元素属性获取

node scripts/360browser_agent.mjs get attr @e1 href   # 获取元素的指定属性值
node scripts/360browser_agent.mjs get styles @e1      # 获取元素的计算样式(字体、颜色、背景等)

5.3 元素位置与布局

node scripts/360browser_agent.mjs get box @e1         # 获取元素的边界框位置和尺寸

5.4 页面信息获取

node scripts/360browser_agent.mjs get title           # 获取当前页面的标题
node scripts/360browser_agent.mjs get url             # 获取当前页面的 URL

5.5 元素统计

node scripts/360browser_agent.mjs get count ".item"   # 计算匹配选择器的元素数量

6. 检查状态

node scripts/360browser_agent.mjs is visible @e1      # 检查元素是否可见
node scripts/360browser_agent.mjs is enabled @e1      # 检查元素是否启用
node scripts/360browser_agent.mjs is checked @e1      # 检查元素是否被选中

7. 截图与 PDF

node scripts/360browser_agent.mjs screenshot          # 保存到临时目录
node scripts/360browser_agent.mjs screenshot path.png # 保存到指定路径
node scripts/360browser_agent.mjs screenshot --full   # 截取全页面

8. 等待

node scripts/360browser_agent.mjs wait @e1                     # 等待元素出现
node scripts/360browser_agent.mjs wait 2000                    # 等待毫秒数
node scripts/360browser_agent.mjs wait --text "Success"        # 等待文本出现(或 -t)
node scripts/360browser_agent.mjs wait --url "**/dashboard"    # 等待 URL 模式(或 -u)
node scripts/360browser_agent.mjs wait --load networkidle      # 等待网络空闲(或 -l)
node scripts/360browser_agent.mjs wait --fn "window.ready"     # 等待 JS 条件(或 -f)

9. 语义定位器(替代 @refs)

node scripts/360browser_agent.mjs find role button click --name "Submit"
node scripts/360browser_agent.mjs find text "Sign In" click
node scripts/360browser_agent.mjs find text "Sign In" click --exact      # 精确匹配
node scripts/360browser_agent.mjs find label "Email" fill "user@test.com"
node scripts/360browser_agent.mjs find placeholder "Search" type "query"
node scripts/360browser_agent.mjs find alt "Logo" click
node scripts/360browser_agent.mjs find title "Close" click
node scripts/360browser_agent.mjs find testid "submit-btn" click
node scripts/360browser_agent.mjs find first ".item" click
node scripts/360browser_agent.mjs find last ".item" click
node scripts/360browser_agent.mjs find nth 2 "a" hover

Cookies 和存储

node scripts/360browser_agent.mjs cookies                     # 获取所有 cookies
node scripts/360browser_agent.mjs cookies set name value      # 设置 cookie
node scripts/360browser_agent.mjs cookies clear               # 清除 cookies
node scripts/360browser_agent.mjs storage local               # 获取所有 localStorage
node scripts/360browser_agent.mjs storage local key           # 获取指定键的值
node scripts/360browser_agent.mjs storage local set k v       # 设置值
node scripts/360browser_agent.mjs storage local clear         # 清除所有

标签页和窗口

node scripts/360browser_agent.mjs tab                 # 列出所有标签页
node scripts/360browser_agent.mjs tab new [url]       # 新建标签页
node scripts/360browser_agent.mjs tab 2               # 切换到指定索引的标签页
node scripts/360browser_agent.mjs tab close           # 关闭当前标签页
node scripts/360browser_agent.mjs tab close 2         # 关闭指定索引的标签页
node scripts/360browser_agent.mjs window new          # 新建窗口

对话框

node scripts/360browser_agent.mjs dialog accept [text]  # 接受对话框
node scripts/360browser_agent.mjs dialog dismiss        # 取消对话框

JavaScript 执行

node scripts/360browser_agent.mjs eval "document.title"   # 执行 JavaScript

示例:表单提交

node scripts/360browser_agent.mjs open https://example.com/form
node scripts/360browser_agent.mjs snapshot -i
# 输出显示:textbox "Email" [ref=e1], textbox "Password" [ref=e2], button "Submit" [ref=e3]

node scripts/360browser_agent.mjs fill @e1 "user@example.com"
node scripts/360browser_agent.mjs fill @e2 "password123"
node scripts/360browser_agent.mjs click @e3
node scripts/360browser_agent.mjs wait --load networkidle
node scripts/360browser_agent.mjs snapshot -i  # 检查结果