Next.js高级特性:定制服务器

通常,您使用来启动下一个服务器next start。但是,可以使用编程方式100%启动服务器以使用自定义路由模式。

自定义服务器无法部署在用于Next.js平台的Vercel上。

在决定使用自定义服务器之前,请记住,仅当Next.js的集成路由器不能满足您的应用程序要求时才应使用它。定制服务器将删除重要的性能优化,例如无服务器功能和自动静态优化。

看一下以下自定义服务器示例:

// server.js
const { createServer } = require('http')
const { parse } = require('url')
const next = require('next')

const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()

app.prepare().then(() => {
  createServer((req, res) => {
    // Be sure to pass `true` as the second argument to `url.parse`.
    // This tells it to parse the query portion of the URL.
    const parsedUrl = parse(req.url, true)
    const { pathname, query } = parsedUrl

    if (pathname === '/a') {
      app.render(req, res, '/a', query)
    } else if (pathname === '/b') {
      app.render(req, res, '/b', query)
    } else {
      handle(req, res, parsedUrl)
    }
  }).listen(3000, (err) => {
    if (err) throw err
    console.log('> Ready on http://localhost:3000')
  })
})

server.js不通过babel或webpack。确保此文件所需的语法和源与您正在运行的当前节点版本兼容。

然后,要运行自定义服务器,您需要更新scriptsin package.json,如下所示:

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

定制服务器使用以下导入将服务器与Next.js应用程序连接:

const next = require('next')
const app = next({})

上面的next导入是一个接收带有以下选项的对象的函数:

  • devBoolean-是否在开发模式下启动Next.js。默认为false
  • dirString-Next.js项目的位置。默认为'.'
  • quietBoolean-隐藏包含服务器信息的错误消息。默认为false
  • confobject-与next.config.js中使用的对象相同。默认为{}

app然后可以将返回的值用于让Next.js根据需要处理请求。

禁用文件系统路由

默认情况下,Next将在与pages文件名匹配的路径名下提供文件夹中的每个文件。如果您的项目使用自定义服务器,则此行为可能导致从多个路径提供相同的内容,这可能会导致SEO和UX问题。

要禁用此行为并防止基于中的文件进行路由pages,请打开next.config.js并禁用useFileSystemPublicRoutes配置:

module.exports = {
  useFileSystemPublicRoutes: false,
}

请注意,useFileSystemPublicRoutes禁用来自SSR的文件名路由;客户端路由可能仍会访问这些路径。使用此选项时,应防止导航到以编程方式不需要的路线。

您可能还希望将客户端路由器配置为禁止客户端重定向到文件名路由。为此,请参阅router.beforePopState

作者:terry,如若转载,请注明出处:https://www.web176.com/nextjs/2430.html

(0)
打赏 支付宝 支付宝 微信 微信
terryterry
上一篇 2021年4月20日 下午2:38
下一篇 2021年4月20日 下午2:46

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注