表单自动填写

通用网页表单自动填写工具。使用OpenClaw的浏览器自动化功能自动填写任何网页表单。

功能特点

• - 📝 通用表单填写：适用于任何网页表单
• 🔐 浏览器会话：使用现有登录状态
• 🎯 智能检测：自动检测表单字段
• 📋 模板支持：保存并重复使用表单数据
• 🌍 多语言支持：支持中文和英文
• ⚡ 快速准确：可靠的表单填写

触发条件

• - 帮我填表 / Help me fill out this form
• 自动填写报名表 / Auto-fill registration form
• 填写求职申请 / Fill job application
• 填写问卷 / Fill out survey
• form-auto [url]

⚠️ 隐私警告

此技能会访问您的浏览器配置文件以填写表单。

• - 🔐 读取浏览器会话以访问表单
• 📝 使用您的数据填写表单字段
• 🌐 代表您与网站交互
• ⚠️ 仅在受信任的网站上使用

步骤1：获取用户信息

询问用户填写表单所需的信息：

请提供需要填写的信息：

基本信息：

• - 姓名:
• 手机号:
• 邮箱:
• 地址:

其他信息（根据表单）：

• - 公司:
• 职位:
• 备注: _

或使用之前会话中保存的个人资料。

步骤2：打开表单网址

javascript
// 打开表单页面
await browser.open({
url: https://example.com/form
})

// 等待页面加载
await browser.wait({ timeout: 5000 })

步骤3：检测表单字段

javascript
// 检测页面上的所有表单字段
const formFields = await browser.evaluate(() => {
const fields = []

// 查找所有输入元素
document.querySelectorAll(input, select, textarea).forEach(el => {
const field = {
type: el.type || el.tagName.toLowerCase(),
name: el.name || ,
id: el.id || ,
placeholder: el.placeholder || ,
label: ,
required: el.required
}

// 尝试查找关联的标签
if (el.id) {
const label = document.querySelector(label[for=${el.id}])
if (label) field.label = label.innerText.trim()
}

// 或查找父级标签
if (!field.label) {
const parentLabel = el.closest(label)
if (parentLabel) field.label = parentLabel.innerText.trim()
}

// 或使用占位符作为标签
if (!field.label && el.placeholder) {
field.label = el.placeholder
}

fields.push(field)
})

return fields
})

console.log(检测到的表单字段:, formFields)

步骤4：填写表单字段

javascript
// 根据类型和标签填写每个字段
async function fillForm(userData) {
for (const field of formFields) {
const value = matchFieldToData(field, userData)

if (value) {
// 填写输入框/文本域
if (field.type === text || field.type === email ||
field.type === tel || field.type === textarea) {
await browser.evaluate((id, name, val) => {
const el = id ? document.getElementById(id) :
document.querySelector([name=${name}])
if (el) {
el.value = val
el.dispatchEvent(new Event(input, { bubbles: true }))
el.dispatchEvent(new Event(change, { bubbles: true }))
}
}, field.id, field.name, value)
}

// 填写下拉选择框
if (field.type === select-one) {
await browser.evaluate((id, name, val) => {
const el = id ? document.getElementById(id) :
document.querySelector([name=${name}])
if (el) {
el.value = val
el.dispatchEvent(new Event(change, { bubbles: true }))
}
}, field.id, field.name, value)
}

// 填写复选框/单选框
if (field.type === checkbox || field.type === radio) {
if (value === true || value === true) {
await browser.evaluate((id, name) => {
const el = id ? document.getElementById(id) :
document.querySelector([name=${name}])
if (el && !el.checked) {
el.click()
}
}, field.id, field.name)
}
}
}
}
}

步骤5：智能字段匹配

python
def matchfieldtodata(field, userdata):
根据标签/名称将表单字段与用户数据匹配

label = (field.get(label, ) + +
field.get(name, ) + +
field.get(placeholder, )).lower()

# 姓名匹配
if any(kw in label for kw in [姓名, 名字, name, 称呼]):
return user_data.get(name, )

# 电话匹配
if any(kw in label for kw in [手机, 电话, phone, tel, mobile]):
return user_data.get(phone, )

# 邮箱匹配
if any(kw in label for kw in [邮箱, email, mail]):
return user_data.get(email, )

# 地址匹配
if any(kw in label for kw in [地址, address, 住址]):
return user_data.get(address, )

# 公司匹配
if any(kw in label for kw in [公司, company, 单位, 组织]):
return user_data.get(company, )

# 职位匹配
if any(kw in label for kw in [职位, position, 岗位, 职务]):
return user_data.get(position, )

# 身份证匹配
if any(kw in label for kw in [身份证, id card, 证件]):
return userdata.get(idcard, )

return None

步骤6：确认并提交

javascript
// 向用户显示已填写的表单摘要
const summary = await browser.evaluate(() => {
const filled = []
document.querySelectorAll(input, select, textarea).forEach(el => {
if (el.value) {
filled.push({
label: el.placeholder || el.name || el.id,
value: el.value
})
}
})
return filled
})

// 询问用户确认
console.log(已填写的字段:)
summary.forEach(item => {
console.log( ${item.label}: ${item.value})
})

// 等待用户确认后再提交
// await browser.click({ selector: button[type=submit] })

模板系统

保存常用的表单数据：

json
{
profile_name: 个人信息,
data: {
name: 张三,
phone: 13800138000,
email: zhangsan@example.com,
address: 北京市朝阳区xxx,
company: xxx科技有限公司,
position: 产品经理
}
}

使用示例

求职申请表

用户：帮我填写这个求职申请表，网址是 https://company.com/apply

助手：

1. 1. 打开网址
2. 检测表单字段
3. 询问用户信息（或使用保存的模板）
4. 自动填写
5. 展示填写结果
6. 等待用户确认提交

报名表

用户：填写这个培训班报名表，我的信息：姓名李四，手机13912345678，邮箱lisi@test.com

助手：

1. 1. 打开报名表网址
2. 检测字段
3. 直接使用用户提供的信息填写
4. 展示结果确认

错误处理

表单无法加载 → 提示用户检查网址
字段检测失败 → 提示手动填写或提供更多信息
填写失败 → 记录失败字段，继续填写其他
提交失败 → 提示用户手动提交

多语言支持

• - 用户语言 → 输出语言
• 支持中文和英文表单

局限性

• - 验证码: 无法自动填写验证码
• 复杂表单: 动态加载的表单可能需要额外处理
• 文件上传: 不支持自动上传文件
• 支付表单: 不支持自动填写支付信息

隐私与安全

数据处理

• - ✅ 不会将数据上传到外部服务器
• ✅ 所有处理在本地完成
• ⚠️ 执行期间会访问浏览器配置文件
• ⚠️ 表单数据输入到