Cómo configurar un servidor personalizado en Next.js

Next.js incluye su propio servidor con next start por defecto. Si tiene un backend existente, aún puede usarlo con Next.js (esto no es un servidor personalizado). Un servidor personalizado de Next.js le permite iniciar un servidor de manera programática para patrones personalizados. La mayoría de las veces no necesitará este enfoque. Sin embargo, está disponible si necesita desacoplarlo.

Es bueno saberlo:

• Antes de decidir usar un servidor personalizado, tenga en cuenta que solo debe usarse cuando el enrutador integrado de Next.js no pueda satisfacer los requisitos de su aplicación. Un servidor personalizado eliminará optimizaciones de rendimiento importantes, como la Optimización Estática Automática.
• Cuando se utiliza el modo de salida independiente, no rastrea archivos de servidor personalizados. Este modo genera un archivo server.js mínimo separado. Estos no pueden usarse juntos.

Consulte el siguiente ejemplo de un servidor personalizado:

import { createServer } from 'http'
import { parse } from 'url'
import next from 'next'

const port = parseInt(process.env.PORT || '3000', 10)
const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()

app.prepare().then(() => {
  createServer((req, res) => {
    const parsedUrl = parse(req.url!, true)
    handle(req, res, parsedUrl)
  }).listen(port)

  console.log(
    `> Server listening at http://localhost:${port} as ${
      dev ? 'development' : process.env.NODE_ENV
    }`
  )
})

server.js no pasa por el proceso de compilación o empaquetado de Next.js. Asegúrese de que la sintaxis y el código fuente que requiere este archivo sean compatibles con la versión actual de Node.js que está utilizando. Vea un ejemplo.

Para ejecutar el servidor personalizado, deberá actualizar los scripts en package.json de la siguiente manera:

{
  "scripts": {
    "dev": "node server.js",
    "build": "next build",
    "start": "NODE_ENV=production node server.js"
  }
}

Alternativamente, puede configurar nodemon (ejemplo). El servidor personalizado utiliza la siguiente importación para conectar el servidor con la aplicación Next.js:

import next from 'next'

const app = next({})

La importación next anterior es una función que recibe un objeto con las siguientes opciones:

La app devuelta puede usarse para que Next.js maneje las solicitudes según sea necesario.