Nuxt.js 服務(wù)器端渲染中間件(serverMiddleware) 屬性

服務(wù)器端渲染中間件(serverMiddleware) 屬性

• 類型: ArrayItems: String 或 Object 或 Function

Nuxt在內(nèi)部創(chuàng)建一個(gè)連接實(shí)例，所以我們可以將我們的中間件注冊(cè)到它的堆棧，并有機(jī)會(huì)提供更多的路由，如API，而無需外部服務(wù)器。因?yàn)檫B接本身是一個(gè)中間件，所以注冊(cè)的中間件既可以用于nuxt start，也可以用作具有編程用法的中間件，如express-template。Nuxt  Modules還可以使用this.addServerMiddleware()設(shè)置serverMiddleware。

服務(wù)器端渲染中間件(serverMiddleware) vs 中間件(middleware)!

不要將它與客戶端或SSR中Vue在每條路由之前調(diào)用的routes middleware混淆。serverMiddleware只是在vue-server-renderer之前在服務(wù)器端運(yùn)行，可用于服務(wù)器特定的任務(wù)，如處理API請(qǐng)求或服務(wù)資產(chǎn)。

用法

如果中間件是String，Nuxt.js將嘗試自動(dòng)解析它。

例如 (nuxt.config.js):

import serveStatic from 'serve-static'

export default {
  serverMiddleware: [
    // Will register redirect-ssl npm package
    'redirect-ssl',

    // Will register file from project api directory to handle /api/* requires
    { path: '/api', handler: '~/api/index.js' },

    // We can create custom instances too
    { path: '/static2', handler: serveStatic(__dirname + '/static2') }
  ]
}

提示! 如果您不希望中間件注冊(cè)所有路由，則必須使用具有特定路徑的`object`，否則nuxt默認(rèn)處理程序?qū)⒉黄鹱饔茫?/p>

自定義服務(wù)器端渲染中間件 (Server Middleware)

編寫自定義中間件也是可能的。有關(guān)更多信息，請(qǐng)參閱 Connect Docs.

Middleware (api/logger.js):

export default function (req, res, next) {
  // req 是 Node.js http request 對(duì)象
  console.log(req.path)

  // res 是 Node.js http response 對(duì)象

  // next是一個(gè)調(diào)用下一個(gè)中間件的函數(shù)
  // 如果您的中間件不是最終執(zhí)行，請(qǐng)不要忘記在最后調(diào)用next！
  next()
}

Nuxt 配置 (nuxt.config.js):

serverMiddleware: [
  '~/api/logger'
]