作为历史悠久的 History API 的现代化替代方案，Navigation API 已于 2026 年 1 月达到 Baseline Newly Available 状态，目前 Chrome、Edge、Firefox 147 和 Safari 26.2 等浏览器均已经支持该 API。该 API 为单页应用程序（SPA）中的客户端导航管理提供了一个集中式的专用接口，解决了困扰 Web 开发者十余年的根本性设计问题。

自推出以来，History API 一直是单页应用的主要路由机制，但它存在着一些众所周知的缺陷。它无法检测所有类型的导航触发器，无法读取完整的历史记录堆栈或编辑非当前条目，而且，其 popstate 事件的行为不一致，在通过代码调用 pushState 或 replaceState 时无法触发。正如 Chrome 开发文档所指出的那样，前 HTML 规范编写者 Ian Hickson 曾将 pushState() 称为他“最喜欢的错误”。Navigation API 是从头开始设计的，旨在完全取代 History API，而非作为增量补丁。

新 API 的核心是 navigate 事件，发生任何类型的导航操作，它都会被触发，无论是点击链接、提交表单、点击后退/前进按钮，还是通过编程调用。这取代了以往那种碎片化的做法——当时开发者必须为链接绑定点击监听器，单独处理 popstate 事件，并考虑各种边界情况。

event.intercept() 方法会自动处理 URL 更新、历史记录堆栈管理以及焦点管理等可访问性原语，从而省去了大量的冗余代码。该 API 还提供了内置的滚动恢复功能、用于取消导航的中止信号，以及用于集中错误处理的 navigateSuccess/navigateError 事件。

Jake Archibald 强调了此次发布的意义：“现在，Web 有了一种更合理、更底层的导航路由机制。”在一段视频演示中，他解释道，该 API 将导航拦截分为两部分：一个是用于在 URL 更改前执行任务的 precommitHandler（例如在旧内容仍然可见时获取数据）；一个是用于在 URL 更新后切换内容的处理程序。不过他指出，Safari 的实现目前尚不支持 precommitHandler。Archibald 补充说：“希望 Safari 能尽快支持 precommitHandler。”

Wael Fadl Allah 是一名开发人员。他一直在尝试使用该 API。他认为这是“构建单页应用（SPA）的变革性技术”，并特别提到了 navigate 事件提供的统一路由控制、navigation.back()、forward()、traverseTo(key) 和 reload() 等可靠的方法，以及具备正确滚动恢复功能的内置状态持久化机制。

Navigation API 还改进了对历史记录条目的管理。开发者可以通过 navigation.entries() 查看完整的同源历史记录条目列表，使用 .getState() 访问任意条目的结构化状态，并使用 traverseTo(key) 直接跳转到特定的条目。与 History API 相比，这是一项重大改进，因为 History API 无法查看历史记录堆栈，也无法跳转到任意条目。

对于希望从 History API 迁移的开发者，GitHub 上的 WICG Navigation API 代码库中提供了一份专门的迁移指南。MDN Web Docs 还提供了全面的参考文档和示例。

值得注意的是，虽然 React Router 、 TanStack Router 这些流行的 SPA 路由器都在公开讨论将 Navigation API 作为其路由逻辑的后端，但在本文撰写之时，两者都尚未推出相关的集成方案。Navigation API 的运行层级低于这些框架路由器，它提供的是平台基础组件，支持更高层次的抽象构建，而非与它们直接竞争。

原文链接：https://www.infoq.com/news/2026/05/navigation-api-browser/