Vue Router 首次打开报 SecurityError，检查带凭据的入口地址

Vue 应用通过 Basic Auth 访问，第一次打开时出现 SecurityError，随后自动刷新一次，页面又能正常显示。若入口地址带有 用户名:密码@主机 这样的 userinfo，错误可能来自 Vue Router 初始化 history，而不是后端拒绝登录。

这一场景在 Vue Router 5.0.7 中出现；已核对的 5.4.0 正式实现仍通过协议和 host 构造部分历史地址。它会保留主机与端口，却不把当前 URL 的 username、password 带过去。浏览器对 history URL 改写的限制比“看起来同源”更细，不能只比 origin 就认定 replaceState() 必须成功。

刷新来自 history 写入失败后的回退

新页面没有 router 所需的 history.state 时，createWebHistory() 会先写入当前条目的导航状态。如果这次 replaceState() 因 URL 改写限制抛错，路由器会改用 location.replace()；后者会发起真正的页面导航。

因此，第一次加载过程中创建的组件状态可能丢失，网络面板会多一次文档请求。第二次加载看似正常，并不证明第一次初始化成功，也不应把重复初始化都归为 Vue 响应式问题。

先保留脱敏后的完整错误栈，确认失败调用位于 history 初始化，再检查地址是否含 userinfo、是否存在 base 标签，以及刷新前后文档 URL。错误发生在另一个脚本手动调用 history 时，或来自短时间过多 history 操作时，应按相应调用继续定位。

从入口地址去掉凭据

对仍需 Basic Auth 的站点，使用不带 userinfo 的正常站点地址，通过浏览器认证提示完成登录，或使用站点已有的受支持认证入口。修改的是书签、测试启动链接和自动化入口，不是取消 Nginx 的认证保护。

不要把密码搬进查询参数、hash 或 router state。它们不能解决认证模型，还可能被日志、历史记录或前端代码读取。已有含凭据的链接应按项目的凭据处理流程替换；分享错误记录前也要删除 userinfo。

若应用需要专门的入口跳转，应在进入 SPA 前明确完成，保留必要路径、查询参数和 hash，并确认跳转目标经过允许的域名与路径校验。不要在 router 初始化前盲目补一次 history.replaceState() 来删除 userinfo：那仍是同一类受限 URL 改写，可能只是把错误提前了。

切换 hash history 会改变 URL 与部署约定，不宜为了掩盖这次刷新直接全站切换。先让入口 URL 和认证流程一致，再验证 web history。

用新的无凭据入口冷启动页面，检查不再因这条 history 错误重载，页面导航和刷新深层路由都保持正常。已有登录态、重新认证和退出后的访问应分别检查；浏览器缓存了 Basic Auth 凭据，不等于应用 URL 仍必须携带它们。