window.history.pushstate需配合popstate监听才能实现完整路由控制：必须传入可序列化state、忽略title、同源url；不监听popstate会导致后退白屏；首次加载不触发popstate；url须为根路径开头的合法路由。
window.history.pushState 确实能改地址栏 URL 且不刷新页面，但直接调用后如果没配套处理，用户点浏览器“后退”或“前进”时会白屏或跳转失败——这不是 API 本身的问题，而是你没接管 popstate 事件。
pushState 调用必须传三个参数，缺一不可
语法是 window.history.pushState(state, title, url)。其中：
-
state必须是可序列化的对象（不能是函数、DOM 节点），后续在popstate里靠它恢复状态 -
title目前所有主流浏览器都忽略它，传空字符串""最安全 -
url必须与当前域同源，且不能是跨协议/跨端口的绝对路径（比如从https://a.com推送到https://b.com/page会报错）
不监听 popstate，后退就等于“丢页”
只推新 URL 不处理返回逻辑，用户点后退时浏览器会发出 popstate 事件，但没人响应，页面停留在原内容，URL 却已变——看起来像卡死。必须主动监听：
window.addEventListener('popstate', (event) => {
const state = event.state;
if (state && state.page === 'detail') {
renderDetailPage(state.id);
}
});
注意：popstate 在页面首次加载时**不会触发**，只在点击后退/前进或 JS 调用 history.back() 等时触发。
URL 改写要符合路由语义，别乱填相对路径
常见错误是传入不合法的 url，比如：
- 传
"user?id=123"→ 缺少路径分隔符，会被拼成https://site.com/user?id=123，但实际想表达的是查询参数变更，应优先用URLSearchParams配合replaceState - 传
"/product/123"→ 合法，但前提是你的服务端或前端路由能响应这个路径，否则用户直接访问该 URL 会 404 - 传
"../about"→ 相对路径解析易出错，一律用以/开头的绝对路径（相对于根）
真正麻烦的不是 push，而是确保每次 URL 变化都有对应的状态快照和视图映射；漏掉一个 popstate 分支，后退就断连。
