如何判断页面跳转来源，实现登录失败跳回时弹出错误提示？

方法1：URL参数携带状态标记（最常用、最稳定） #

该方案不受浏览器隐私策略限制，是同场景下的首选实现方式：

• Control_login校验账号密码失败跳转回Login页时，给跳转地址追加错误标记参数，示例：/login?err=auth_fail
• 在Login页的初始化逻辑中读取URL查询参数，匹配到对应错误标记时直接触发你已实现的弹窗逻辑即可
• 若需要美化URL，可在弹窗触发后用history.replaceState移除参数，不会留下多余的历史记录

代码示例：
Control_login跳转逻辑（各类后端语言逻辑一致，此处以PHP为例）：

// 账号密码校验不通过时执行跳转
header('Location: /login?err=auth_fail');
exit;

Login页参数读取逻辑（JS示例）：

const queryParams = new URLSearchParams(window.location.search);
if (queryParams.get('err') === 'auth_fail') {
  // 调用你已封装的弹窗方法
  showErrorTip('邮箱或密码错误');
  // 可选：移除URL参数不刷新页面
  history.replaceState({}, document.title, window.location.pathname);
}

方法2：读取document.referrer获取跳转来源（不推荐，兼容性差） #

如果仅需要判断跳转来源，可通过浏览器原生的document.referrer属性获取上一页地址，匹配Control_login的路径即可触发弹窗。但该方案存在大量限制场景：

• 浏览器隐私模式下会返回空值
• 用户手动输入地址访问登录页时返回空值
• HTTPS站点跳转HTTP站点时会丢失referrer信息

代码示例：

if (document.referrer.includes('Control_login')) {
  showErrorTip('邮箱或密码错误');
}

方法3：临时存储标记（适合需要携带复杂错误信息的场景） #

如果需要传递更多错误细节，可通过临时存储实现状态传递：

• Control_login跳转前在sessionStorage中写入错误标记：sessionStorage.setItem('login_err', '1')
• Login页初始化时读取标记，匹配到后触发弹窗，同时立刻删除标记，避免下次进入登录页误触发

代码示例：

if (sessionStorage.getItem('login_err') === '1') {
  showErrorTip('邮箱或密码错误');
  sessionStorage.removeItem('login_err');
}

优先推荐使用方法1，实现成本低、兼容性好，几乎无异常触发场景。

内容的提问来源于stack exchange，提问作者BefitMango706