目录
当前位置: 首页 > 文档资料 > Next.js 中文文档 >

禁止文件路由

优质
小牛编辑
129浏览
2023-12-01

默认情况,Next将会把/pages下的所有文件匹配路由(如/pages/some-file.js 渲染为 site.com/some-file

如果你的项目使用自定义路由,那么有可能不同的路由会得到相同的内容,可以优化 SEO 和用户体验。

禁止路由链接到/pages下的文件,只需设置next.config.js文件如下所示:

// next.config.js
module.exports = {
  useFileSystemPublicRoutes: false
}

注意useFileSystemPublicRoutes只禁止服务端的文件路由;但是客户端的还是禁止不了。

你如果想配置客户端路由不能跳转文件路由,可以参考Intercepting popstate

动态前缀

有时你需要设置动态前缀,可以在请求时设置assetPrefix改变前缀。

使用方法如下:

const next = require('next')
const micro = require('micro')

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

app.prepare().then(() => {
  const server = micro((req, res) => {
    // Add assetPrefix support based on the hostname
    if (req.headers.host === 'my-app.com') {
      app.setAssetPrefix('http://cdn.com/myapp')
    } else {
      app.setAssetPrefix('')
    }

    handleNextRequests(req, res)
  })

  server.listen(port, (err) => {
    if (err) {
      throw err
    }

    console.log(`> Ready on http://localhost:${port}`)
  })
})