A propriedade serverMiddleware

Define o intermediário no lado do servidor.

Tipo: Array
- Itens: String ou Object ou Function

O Nuxt internamente cria um instância de connect que você pode adicionar ao seu próprio intermediário. Isto permite-nos registar rotas adicionais (normalmente rotas /api) sem precisar de um servidor externo.

Por connect mesmo ser um intermediário, o intermediário registado funcionará com ambos nuxt start e também quando usado como um intermediário com uso programático como o express-template . Os Módulos do Nuxt pode também fornecer o serverMiddleware usando o this.addServerMiddleware()

Adicionalmente a eles, nós introduzimos uma opção prefix a qual o valor padrão será true. Ela adicionará uma base de roteador para os intermediários do seu servidor.

Exemplo:

Caminho do intermediário do servidor: /server-middleware
Base de roteador: /admin
Com o prefix: true (valor padrão): /admin/server-middleware
Com o prefix: false: /server-middleware

serverMiddleware vs middleware!

Não confunda ele com o intermediários de rotas as quais são chamadas antes de cada rota pelo Vue no lado do cliente ou na renderização no lado do servidor. O intermediário listado dentro da propriedade serverMiddleware executa no lado do servidor antes do vue-server-renderer e pode ser usado para tarefas específicas do servidor como manipulando de requisições de API ou servindo recursos.

Não adicione o serverMiddleware ao diretório middleware/.Os intermediários são empacotados pelo webpack dentro do seu pacote de produção e executam sobre o gatilho beforeRouteEnter. Se você adicionar o serverMiddleware ao diretório middleware/ ele será erradamente tomado pelo Nuxt como um intermediário comum e adicionará dependências erradas ao seu pacote ou gerar erros.

Uso

Se o intermediário for um sequência de caracteres o Nuxt tentará pedir e resolver ele automaticamente.

nuxt.config.js

import serveStatic from 'serve-static'

export default {
  serverMiddleware: [
    // Registará o pacote `redirect-ssl` de npm 
    'redirect-ssl',

    // Registará o ficheiro do diretório `server-middleware` do projeto manipular os pedidos de  `/server-middleware/*`
    { path: '/server-middleware', handler: '~/server-middleware/index.js' },

    // Podemos também criar instâncias personalizadas
    { path: '/static2', handler: serveStatic(__dirname + '/static2') }
  ]
}

Se você não quiser o intermediário para registar para todas rotas, você tem que usar a forma de objeto com um caminho específico, de outra maneira o manipulador padrão do Nuxt não funcionará!

Intermediário de Servidor Personalizado

É também possível escrever um intermediário personalizado. Para mais informações consulte a Documentação do Connect .

Intermediário (server-middleware/logger.js):

server-middleware/logger.js

export default function (req, res, next) {
  // O `req` é o objeto de requisição http do Node.js
  console.log(req.url)

  // O `res` é o objeto de resposta http do Node.js

  // O `next` é uma função para chamar o próximo intermediário
  // Não esqueça de chamar o `next` no final se o seu intermediário não for um ponto final!
  next()
}

nuxt.config.js

serverMiddleware: ['~/server-middleware/logger']

Ponto Final de API Personalizada

Um intermediário de servidor pode também estender o Express. Isto permite a criação de pontos finais de REST.

server-middleware/rest.js

const bodyParser = require('body-parser')
const app = require('express')()

app.use(bodyParser.json())
app.all('/getJSON', (req, res) => {
  res.json({ data: 'data' })
})

module.exports = app

nuxt.config.js

serverMiddleware: [
  { path: "/server-middleware", handler: "~/server-middleware/rest.js" },
],

A Sintaxe de Objeto

Se o seu intermediário de servidor compreende em uma lista de funções mapeadas para os caminhos:

export default {
  serverMiddleware: [
    { path: '/a', handler: '~/server-middleware/a.js' },
    { path: '/b', handler: '~/server-middleware/b.js' },
    { path: '/c', handler: '~/server-middleware/c.js' }
  ]
}

Você pode alternativamente passar um objeto para definir eles, como o seguinte:

export default {
  serverMiddleware: {
    '/a': '~/server-middleware/a.js',
    '/b': '~/server-middleware/b.js',
    '/c': '~/server-middleware/c.js'
  }
}