如何工作

使用 Inertia，你可以像你一直在你选择的服务器端 Web 框架中建立应用程序一样建立应用程序。你可以使用你的框架的现有功能进行路由、控制器、中间件、认证、授权、数据获取等。

然而，Inertia 替换了你的应用程序的视图层。而不是通过 PHP 或 Ruby 模板进行服务器端渲染，你的应用程序返回的视图是 JavaScript 页面组件。这允许你使用 React、Vue 或 Svelte 构建你的全部前端，同时仍然享受 Laravel 或你选择的服务器端框架的生产力。

正如你所期望的，仅仅在 JavaScript 中创建你的前端并不能给你一个单页应用程序体验。如果你点击一个链接，你的浏览器将进行一个完整的页面访问，然后在下一个页面载入时导致你的客户端框架重启。这就是 Inertia 改变一切的地方。

在其核心，Inertia 本质上是一个客户端路由库。它允许你在不强制全页重新加载的情况下进行页面访问。使用 <Link> 组件可以完成这个任务，这是一个普通锚链接的轻量级包装。当你点击一个 Inertia 链接，Inertia 会拦截点击并通过 XHR 进行访问。你甚至可以在 JavaScript 中使用 router.visit() 来进行这些访问。

当 Inertia 进行 XHR 访问时，服务器会检测到这是一个 Inertia 访问，并且不返回完整的 HTML 响应，而是返回一个带有 JavaScript 页面组件名称和数据（属性）的 JSON 响应。然后 Inertia 动态地用新的页面组件替换出以前的页面组件，并更新浏览器的历史状态。

最终结果是一个非常流畅的单页体验。 🎉

要了解更多关于 Inertia 在底层如何工作的细节，可以查看 协议页面。