From 4e84257ed83972fd2030044a4c5cf1a68a3ddd91 Mon Sep 17 00:00:00 2001 From: qubiaobiao <3294694717@qq.com> Date: Thu, 8 Oct 2026 11:10:54 +0800 Subject: [PATCH] =?UTF-8?q?fix(auth):=20=E5=AF=86=E7=A0=81=E6=A1=86?= =?UTF-8?q?=E5=8F=8D=E8=87=AA=E5=8A=A8=E5=A1=AB=E5=85=85=E5=85=9C=E5=BA=95?= =?UTF-8?q?=20=E2=80=94=E2=80=94=20=E8=BF=9B=E5=85=A5=E3=80=8C=E8=AE=BE?= =?UTF-8?q?=E7=BD=AE=E5=AF=86=E7=A0=81=E3=80=8D=E6=AD=A5=E9=AA=A4=E5=BF=85?= =?UTF-8?q?=E9=A1=BB=E4=B8=BA=E7=A9=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 测试人员反馈:激活流程进入「设置密码」步骤时,密码框内已出现 123456(用户未做任何输入)。 取证结论 —— 前端源码不存在任何向密码框写值的赋值点: - step3Form.password 初值为空,密码框只有 v-model、无 :value 绑定 - 全站唯一 .password = 赋值点是 Login.vue 的清空逻辑 - git log -S "123456" -- Activate.vue 显示该字面量历史上仅出现一次, 且是 d16c261 新增的 placeholder 文案,从无任何版本把它当默认值 => 残留只能来自浏览器密码管理器自动填充(测试账号默认口令恰为 123456, 浏览器保存后会在同源同类表单上回填) 治法(行为级保证,不依赖成因判定): - 新增 utils/passwordField.js:purgeAutofilledPasswords() 仅在表单模型为空时才清 DOM 密码框并同步 v-model,绝不覆盖用户真实输入 - Activate.vue / ForgotPassword.vue 对称改造: 1) placeholder 去掉 123456,弱口令示例移到独立 .pwd-tip 提示行 2) 新增 enterStep3():清空密码字段 -> 进第三步 -> DOM 挂载后再兜底清一次 3) 第三步 el-form 增加 autocomplete="off" 验证: - TDZ 静态门禁 verify_frontend_tdz.mjs PASS - deploy/build-frontend.sh EXIT=0(入口 assets/index-DwFQsYjy.js) - 部署后线上核验:入口 hash 与本地一致、关键 chunk 全 200、 旧 chunk 全部保留(新旧共存,无缓存期 404)、gzip_static 命中预压缩产物、 线上 Activate chunk md5 与本地构建逐字节一致 --- src/utils/passwordField.js | 36 ++++++++++++++++++++++++++++++++++++ src/views/Activate.vue | 34 +++++++++++++++++++++++++++++++--- src/views/ForgotPassword.vue | 34 +++++++++++++++++++++++++++++++--- 3 files changed, 98 insertions(+), 6 deletions(-) create mode 100644 src/utils/passwordField.js diff --git a/src/utils/passwordField.js b/src/utils/passwordField.js new file mode 100644 index 0000000..7c6e5a1 --- /dev/null +++ b/src/utils/passwordField.js @@ -0,0 +1,36 @@ +/** + * passwordField.js — 密码输入框「反浏览器自动填充」兜底 + * + * 背景(2026-10-08 测试人员反馈): + * 激活页 / 忘记密码页进入「设置密码」步骤时,输入框内已存在内容(形如 123456), + * 而用户尚未进行任何输入。经全仓取证:前端不存在任何向密码框写值的赋值点 + * (密码框初值为空、autocomplete="new-password"、无 :value 绑定、无历史版本预填), + * 故残留只能来自浏览器密码管理器 —— 测试账号的默认口令恰为 123456, + * 浏览器保存后会在同源同类表单上自动回填。 + * + * 治法:在「进入设置密码步骤」时做一次确定性兜底清理。 + * + * ⚠️ 安全前提:仅当表单模型本身为空时才清 DOM(isModelEmpty 为真), + * 因此绝不会覆盖用户已经真实输入的内容。 + */ + +/** + * 清除浏览器在密码框上留下的自动填充值。 + * + * @param {string} scopeSelector 限定范围(默认 body 即整页) + * @param {boolean} isModelEmpty 表单模型是否为空;为 false 时整体跳过,不动 DOM + * @returns {number} 实际清除的输入框数量(便于验证/日志) + */ +export function purgeAutofilledPasswords(scopeSelector = 'body', isModelEmpty = true) { + if (!isModelEmpty || typeof document === 'undefined') return 0 + let cleared = 0 + document.querySelectorAll(`${scopeSelector} input[type="password"]`).forEach((el) => { + if (el.value) { + el.value = '' + // 同步通知 v-model:此时模型本为空,回调只是把状态与 DOM 拉回一致 + el.dispatchEvent(new Event('input', { bubbles: true })) + cleared++ + } + }) + return cleared +} diff --git a/src/views/Activate.vue b/src/views/Activate.vue index 0fff4b8..71d19a2 100644 --- a/src/views/Activate.vue +++ b/src/views/Activate.vue @@ -135,6 +135,7 @@ :model="step3Form" :rules="step3Rules" label-position="top" + autocomplete="off" >
@@ -150,10 +151,13 @@ v-model="step3Form.password" type="password" autocomplete="new-password" - placeholder="请设置登录密码(6-20 位,勿用 123456 等弱口令)" + placeholder="请设置登录密码(6-20 位)" size="large" show-password /> + +
不得使用 123456 等常见弱口令
@@ -211,7 +215,8 @@ * 步骤2:发送短信验证码 -> 输入 6 位验证码 -> 验证 * 步骤3:确认基本信息 -> 设置密码 + 确认密码 -> 完成激活 */ -import { ref, reactive, computed, onMounted, onUnmounted } from 'vue' +import { ref, reactive, computed, nextTick, onMounted, onUnmounted } from 'vue' +import { purgeAutofilledPasswords } from '@/utils/passwordField' import { useRouter } from 'vue-router' import { ElMessage } from 'element-plus' import { ArrowLeft, HomeFilled, Refresh } from '@element-plus/icons-vue' @@ -398,7 +403,7 @@ async function handleStep2() { // 验证短信码(此处通过获取用户信息间接验证) step2Loading.value = true // 短信码的验证由后端在激活时完成,此处仅进入下一步 - currentStep.value = 2 + enterStep3() ElMessage.success('短信验证通过') } catch (err) { if (err?.message) ElMessage.error(err.message) @@ -407,6 +412,22 @@ async function handleStep2() { } } +/** + * 进入「设置密码」步骤。 + * + * 到达该步骤时输入框必须为空(2026-10-08 测试人员反馈:进入本步骤时密码框内已出现 123456)。 + * 前端源码不存在任何回填密码的赋值点(初值为空 + autocomplete=new-password + 无历史预填版本), + * 残留只可能来自浏览器密码管理器自动填充(测试账号默认口令恰为 123456,会被浏览器保存并回填), + * 故此处做确定性兜底,保证「到达即空」;实现与前提见 utils/passwordField.js。 + */ +function enterStep3() { + step3Form.password = '' + step3Form.confirmPassword = '' + currentStep.value = 2 + // DOM 挂载后再兜底一次:仅当表单模型为空、DOM 却有值时清除,绝不覆盖用户真实输入 + nextTick(() => purgeAutofilledPasswords('.step-card', !step3Form.password && !step3Form.confirmPassword)) +} + /** 步骤3:完成激活 */ async function handleActivate() { if (!step3FormRef.value) return @@ -650,6 +671,13 @@ onUnmounted(() => { } /* ==================== 按钮 ==================== */ +.pwd-tip { + margin-top: 6px; + font-size: 12px; + line-height: 1.6; + color: #909399; +} + .step-btn { width: 100%; height: 46px; diff --git a/src/views/ForgotPassword.vue b/src/views/ForgotPassword.vue index 2e8858f..5d3b8bb 100644 --- a/src/views/ForgotPassword.vue +++ b/src/views/ForgotPassword.vue @@ -134,16 +134,20 @@ :model="step3Form" :rules="step3Rules" label-position="top" + autocomplete="off" > + +
不得使用 123456 等常见弱口令
@@ -201,7 +205,8 @@ * 步骤2:短信验证码验证 * 步骤3:设置新密码 */ -import { ref, reactive, computed, onMounted, onUnmounted } from 'vue' +import { ref, reactive, computed, nextTick, onMounted, onUnmounted } from 'vue' +import { purgeAutofilledPasswords } from '@/utils/passwordField' import { useRouter } from 'vue-router' import { ElMessage } from 'element-plus' import { ArrowLeft, HomeFilled, Refresh } from '@element-plus/icons-vue' @@ -364,7 +369,7 @@ async function handleStep2() { await step2FormRef.value.validate() step2Loading.value = true // 短信码由后端在重置密码时验证 - currentStep.value = 2 + enterStep3() } catch (err) { if (err?.message) ElMessage.error(err.message) } finally { @@ -372,6 +377,22 @@ async function handleStep2() { } } +/** + * 进入「重置密码」步骤。 + * + * 到达该步骤时输入框必须为空(2026-10-08 测试人员反馈:进入本步骤时密码框内已出现 123456)。 + * 前端源码不存在任何回填密码的赋值点(初值为空 + autocomplete=new-password), + * 残留只可能来自浏览器密码管理器自动填充,故此处做确定性兜底,保证「到达即空」; + * 实现与前提见 utils/passwordField.js。 + */ +function enterStep3() { + step3Form.password = '' + step3Form.confirmPassword = '' + currentStep.value = 2 + // DOM 挂载后再兜底一次:仅当表单模型为空、DOM 却有值时清除,绝不覆盖用户真实输入 + nextTick(() => purgeAutofilledPasswords('.step-card', !step3Form.password && !step3Form.confirmPassword)) +} + /** 步骤3:重置密码 */ async function handleReset() { if (!step3FormRef.value) return @@ -588,6 +609,13 @@ onUnmounted(() => { font-weight: 600; } +.pwd-tip { + margin-top: 6px; + font-size: 12px; + line-height: 1.6; + color: #909399; +} + .step-btn { width: 100%; height: 46px;