Nuxt:区别nuxtServerInit与Mddleware与插件

时间:2019-12-11 19:34:36

标签: nuxt

之间有什么区别 1)nuxtServerInit 2)中间件 3)插件

什么时候在服务器端处理,什么时候在客户端处理。

1 个答案:

答案 0 :(得分:1)

  1. nuxtServerInit
  

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

  1. Middleware
  

在通用模式下,一次(在对Nuxt应用程序的第一个请求时或在页面刷新时)中间件将被称为服务器端,而在导航到其他路由时将称为客户端。在SPA模式下,在第一个请求以及导航到其他路由时,中间件将被称为客户端。

  1. Plugins
  

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

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


现在开始深入探讨差异。

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

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

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

中间件始终在页面导航之间运行,并且将在服务器上为第一条路线调用中间件,然后在客户端为用户进行的每一次导航调用中间件。这使得它非常适合执行诸如检查页面之间的身份验证之类的事情。

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

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

当您开始深入研究Nuxt时,您会发现这些差异会变得非常模糊,并且发现这3种技术中的每一种在技术上几乎都能完成其他技术所能做的。只需确保考虑要解决的问题,然后选择最适合您的工具即可。