Nuxt: Difference nuxtServerInit vs Mddleware vs Plugin



两者有什么区别 1( nuxt服务器初始化 2( 中间件 3( 插件

何时在服务器端处理,何时在客户端处理。

  1. nuxtServerInit

如果在存储中定义了操作nuxtServerIniit,则Nuxt.js将使用上下文(仅从服务器端(调用它。当我们在服务器上有一些数据想要直接提供给客户端时,这很有用。

  1. 中间件

通用模式下,中间件将在服务器端调用一次(在第一次请求Nuxt应用程序时或页面刷新时(,并在导航到更多路由时调用客户端。在 SPA 模式下,中间件将在第一个请求和导航到更多路由时调用客户端。

  1. >插件

Nuxt.js 允许您在实例化根 Vue.js 应用程序之前定义要运行的 JavaScript 插件。

对于没有直接提及的插件,要记住的一件有趣的事情是,它们在服务器上调用一次,在客户端上调用一次(除非您另有配置(。


所以现在要谈谈差异。

NuxtServerInit是3个中最独特的。 它的用例非常清晰:用服务器上可用的数据填充 Vuex 存储。 这对于使用某些会话特定数据设置存储非常有用。

插件和中间件之间的区别实际上归结为两件事:

  1. 当它们运行时。
  2. 它们运行了多少次。

中间件始终在页面导航之间运行,并将在服务器上调用第一个路由,然后在客户端上调用用户之后进行的每次导航。 这使其成为执行诸如检查页面之间的身份验证之类的操作的理想选择。

插件(默认情况下(在服务器和客户端上运行,但重要的是要记住它们只在客户端上运行一次(除非您刷新(。 这使得它们非常适合导入和设置库,这些库可以添加到Nuxt实例中。

插件也会在创建Nuxt实例之前运行,这意味着您无法使用this访问Nuxt。 这应该进一步说明插件通常应该用于配置和加载依赖项的观点。 显然,这是一个过度简化,也有例外,但这应该是一个很好的起点。

当您开始深入研究Nuxt时,您会发现这些差异可能会变得非常模糊,并发现这3个中的每一个在技术上几乎可以做其他所有事情。 只要确保考虑要解决的问题,并选择对您最有意义的工具。

最新更新