ERP浏览器自动登录技能

概述

ERP 浏览器自动登录（ERP-Browser-Login）

统一管理两家 ERP 的浏览器自动登录，通过 Chrome 远程调试端口 (CDP, port 9222) 控制真实 Chrome。

这是后续一切 ERP 页面任务（打单发货、订单导出、库存查询等）的前置步骤。

通用环境前提（两家用同一套）

• Chrome 调试配置目录：$USERPROFILE/chrome-debug-profile（登录态存于此；Chrome 不允许对默认 User Data 开远程调试，必须用独立目录）
• Chrome 可执行文件：C:/Program Files (x86)/Google/Chrome/Application/chrome.exe
• Managed Node：$USERPROFILE/.workbuddy/binaries/node/versions/<版本>/node.exe（版本目录可能带后缀如 22.22.2-2，先 ls 确认）
• 运行脚本必须设置：NODE_PATH=$USERPROFILE/.workbuddy/binaries/node/workspace/node_modules（puppeteer-core 所在）
• 脚本一律通过 browserURL: http://localhost:9222 连接，自动查找目标域名的标签页
• 填表单值必须用 native setter + input/change 事件（React/Vue 受控组件，直接改 value 无效）

启动/重启 Chrome 调试模式（端口未监听时执行）

taskkill //F //IM chrome.exe 2>/dev/null; sleep 1
"C:/Program Files (x86)/Google/Chrome/Application/chrome.exe" 
  --remote-debugging-port=9222 
  --user-data-dir="$USERPROFILE/chrome-debug-profile" 
  --no-first-run --disable-default-apps 
  "<目标ERP登录页URL>" &
sleep 6
curl -s http://localhost:9222/json/version | head -3   # 有输出=调试端口就绪

一、聚水潭 ERP (erp321.com)

触发场景（必须优先加载本技能）

• 用户要求"登录聚水潭 / ERP321 / erp321.com / 聚水潭ERP"
• 任何需要操作 www.erp321.com、print.scm121.com(打单发货极速版)、api.erp321.com 的任务
• ERP 会话过期需要重新登录、或要切换账号

工作流

B. 自动登录（账号密码由调用方提供）

NODE_PATH=... node scripts/erp_login.js "<账号>" "<密码>"

登录表单结构：账号输入框 #login_id、密码 #password、协议 .ant-checkbox-input、按钮文本"立即登录"。

C. 切换账号（清 cookie 重登）

NODE_PATH=... node scripts/erp_login.js "新账号" "新密码" --switch

--switch 会先清 erp321/scm121/sursung 域 cookie 再重登。

D. 判断是否登录成功

NODE_PATH=... node scripts/erp_check_state.js

成功标志：URL 含 epaas 且页面文本出现菜单（订单/商品/库存…）或"欢迎您"。

E. 修改密码（含图形验证码）

# 1) 打开修改密码弹窗并填好旧/新/确认密码（留验证码空）
NODE_PATH=... node scripts/erp_open_pwd_form.js "<旧密码>" "<新密码>"
# 2) 下载当前验证码图片到 captcha_pwd.png
NODE_PATH=... node scripts/erp_get_captcha.js
# 3) 用多模态 Read 识别 captcha_pwd.png（当前模型若不能读图则请用户输入验证码）
# 4) 填入验证码并提交
NODE_PATH=... node scripts/erp_submit_pwd.js "<验证码>"

入口：右上角用户名 → 账号密码管理 → 修改密码。弹窗字段：#oldPassword #imageCode #newPassword #repeatPassword；"确 定"按钮在 .ant-modal-footer（不在 body 内）。新密码规则：含字母+数字、至少8位无序字符。提交 API：POST https://api.erp321.com/usercenterapi/Passport/PasswordReset。注意：验证码错误时（API code 301116）系统自动刷新图片，必须重新下载新验证码再提交。

聚水潭图形验证码识别要点

1. 验证码图片 <img class="img-vc">，URL 形如 https://www.erp321.com/ValidCode.aspx?channel=...&id=...&t=<毫秒时间戳>，每次刷新 t 变化。
2. 必须用页面上下文 fetch(img.src, {credentials:'include'}) 转 base64 保存（带登录 cookie，外部 curl 拿不到）。
3. 提交失败 → 页面 img src 已更新 → 重新下载识别。
4. 识别需多模态视觉；若当前模型不支持读图，把图片路径展示/发给用户请其输入。

二、万里牛 ERP (erp.hupun.com)

登录 https://erp.hupun.com/login，自动处理两种验证码，最终进入 https://erp.hupun.com/frame/ 主界面。主界面可能弹出"软件即将到期"提示框，点"关闭"即可，不影响操作。

执行流程（按顺序）

第1步：填写登录表单

NODE_PATH=... node scripts/wln_login.js "<账号>" "<密码>"

• 找/开 hupun.com 标签页，填 Element-UI 表单（输入框 placeholder 含"请输入手机号/邮箱"，密码框 #input-password），探测是否出现验证码。
• 若 URL 已不在 /login（已在系统内）则跳过登录直接可用。

第2步：点击真实登录按钮

NODE_PATH=... node scripts/wln_click_login.js

• 关键坑：页面上有个 DIV 文本是"登 录"（错误目标，点了没反应）；必须选 button 元素且文本精确等于"登录"。
• 点击后监听网络：captcha/generate?mode=Puzzle = 滑块验证码；mode=ImageText = 文字验证码（多为滑块失败后服务端升级）。

第3步A：滑块拼图验证码（mode=Puzzle）

NODE_PATH=... node scripts/wln_slider_v2.js

• 模板匹配法：取拼图块 alpha>128 的像素，在背景图上粗扫(step 2)+细扫(step 1)找最小色差位置。
• 拖距 = 缺口中心(显示坐标) − 拼图当前中心，再乘轨道比 (310−50)/(310−40) ≈ 0.963。
• human-like 轨迹拖拽（35步 ease-out + y抖动 + 12-28ms间隔）。
• DOM 参考：.puzzle-captcha 350×270；背景img 310×160；拼图块 40×160；.range-slider 手柄 50×50，轨道宽 310。
• 简单边缘直方图法不可靠，勿再用。滑块失败 1-2 次后服务端通常切换为文字模式，直接走 3步B 反而更稳。

第3步B：文字验证码（mode=ImageText）★核心技巧，成功率高

1. 去噪识别（scripts/wln_captcha_clean.js）：
   • 验证码 img 为 data:image/png（自然尺寸约 600×240，显示 300×120），字符=大色块，干扰=细彩色波浪线+小圆环。
   • 原理：页面 canvas 解码 → 墨迹掩码(与白色距离>60) → 5×5 腐蚀（去掉所有细线）→ 5×5 膨胀（恢复字符）→ 输出黑白图 wln_captcha_clean.png。
   • 去噪后字符非常清晰（如 P C R T），多模态直接读图识别。实测裸图识别连错6次，去噪后一次通过——务必用去噪图识别。
2. 提交（scripts/wln_text_submit.js <4位验证码>）：
   • 填输入框（placeholder 含"字符"）→ 点 BUTTON "验证" → 监听响应。
   • 判定：captcha/validate 响应 body 为 valid = 通过，随后 302 到 loginSpringBoard → URL 变 /frame/ 登录成功；body 为 ImageText = 失败，服务端自动 generate 新图，重新去噪识别提交。
   • 验证码必须 4 位才会发请求（前端长度校验拦截）。
   • 验证期间表单账号密码保持填写状态，验证通过即自动完成登录。

第4步：确认成功

最终 URL 为 https://erp.hupun.com/frame/ 即成功。

三、通用故障排查

聚水潭专属

脚本清单（统一在 scripts/ 一级目录，erp_*=聚水潭，wln_*=万里牛）

聚水潭：

• erp_login.js <账号> <密码> [--switch] —— 登录/换号
• erp_check_state.js —— 登录状态检查
• erp_open_pwd_form.js <旧密码> <新密码> —— 打开改密弹窗并填字段
• erp_get_captcha.js —— 下载图形验证码到 captcha_pwd.png
• erp_submit_pwd.js <验证码> —— 填验证码提交改密

万里牛：

• wln_login.js <账号> <密码> —— 填写登录表单
• wln_click_login.js —— 点击真实登录按钮
• wln_slider_v2.js — 滑块拼图自动求解（模板匹配）
• wln_captcha_clean.js — 文字验证码形态学去噪（供识别）
• wln_text_submit.js <验证码> — 提交文字验证码并判定结果

复用注意

• 每次运行脚本会截图到当前工作目录便于核验。
• ⚠️ 本技能不含任何账号/密码/身份信息，可安全分享。 使用时账号密码由调用方实时通过命令行参数传入。
• 若需要记住常用账号，请存入本地私密记忆文件（不入技能、不入代码仓库），由调用流程读取后作为参数传入。
• 聚水潭打单发货 branchSent 在 print.scm121.com iframe 内：登录态建立后通过 page.frames() 找该 frame 操作；跨域 iframe evaluate 偶发报错，可改用页面内 document.querySelector('iframe[src*="print.scm121"]').contentDocument 兜底。