javascript登录错误处理需分层分支：前端先校验表单，再依http状态码、业务码、字段错误等精准反馈，推荐用switch匹配后端code并封装映射函数提升可维护性。
JavaScript 中处理用户登录错误状态，核心是用分支逻辑（if、else if、switch 或现代的早期返回 + 状态码判断）对后端返回的错误信息做分类响应。关键不是只看 HTTP 状态码，而是结合 错误类型（如 401、403、422）、错误字段（如 email、password）、业务码（如 ERR_USER_NOT_FOUND）和具体消息 做精准反馈。
根据后端返回的状态码和错误结构做分支
多数登录接口返回标准 HTTP 状态码 + JSON 错误体。例如：
- 400 / 422：参数不合法（邮箱格式错、密码太短）→ 提示具体字段问题
- 401：认证失败（账号或密码错误）→ 显示“账号或密码不正确”
- 403：账号被禁用/未激活 → 引导用户查邮箱或联系客服
- 404：用户不存在 → 可提示“该账号未注册”，也可为安全隐藏细节（统一说“账号或密码错误”）
- 500 / 网络异常：服务不可用 → 显示“系统繁忙，请稍后再试”并记录日志
用 switch 匹配业务错误码（推荐后端统一约定）
如果后端在响应中提供 code 字段（如 {"code": "USER_LOCKED", "message": "账号已被锁定"}），用 switch 更清晰：
deep-java-review
下载
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
fetch('/api/login', { method: 'POST', body: formData })
.then(res => res.json())
.then(data => {
if (data.success) {
// 登录成功
} else {
switch (data.code) {
case 'INVALID_CREDENTIALS':
showErrorMessage('账号或密码错误');
break;
case 'USER_DISABLED':
showErrorMessage('您的账号已被停用，请联系管理员');
break;
case 'MISSING_CAPTCHA':
showErrorMessage('请完成验证码验证');
break;
case 'TOO_MANY_ATTEMPTS':
showErrorMessage('尝试次数过多，请15分钟后重试');
break;
default:
showErrorMessage(data.message || '登录失败，请重试');
}
}
});
表单级校验与登录错误分开处理
分支逻辑要分层：前端先做基础校验（非空、邮箱格式），失败不发请求；真正发请求后的错误才走后端返回分支：
- 邮箱为空 → 立即标红提示“邮箱不能为空”，不调用登录 API
- 邮箱格式错误 → 提示“请输入正确的邮箱地址”，阻止提交
- API 返回 422 且含
errors.email→ 显示后端校验结果：“该邮箱未注册” - 避免重复提示：表单校验失败时，清空上一次的 API 错误提示
用函数封装错误映射逻辑，提升可维护性
把错误码到提示语的映射抽成纯函数，方便复用和国际化：
const getLoginErrorMessage = (error) => {
const { code, status, errors } = error;
if (status === 401 || code === 'INVALID_CREDENTIALS') {
return '账号或密码不正确';
}
if (code === 'USER_INACTIVE') {
return '账号尚未激活，请查收注册邮件';
}
if (errors?.email) {
return errors.email[0]; // 如后端返回字段级错误
}
return '登录失败，请检查网络或稍后重试';
};
// 使用
.catch(err => {
const msg = getLoginErrorMessage(err.response?.data || err);
showErrorMessage(msg);
});
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
