如何在部署到 Vercel 的 Next js 中禁用目录列表

Question

我已经部署了内置网站 Next.js 显然，当您部署下一个 js 应用程序时，您可以找到我不太满意的所有静态文件和资源的目录。

目录是这样生成的：mydomain.com/_next/static在我的例子中是https://www.ovanya.com/_next/static/

这是目录：

下一个js docs 说：

To prevent showing a Directory Listing page, add an index file, such as index.html, which will then show that file instead when accessing the directory's path.

但是我真的不明白我应该把index.html文件添加到什么目录？那么我应该把 index.html 放在什么地方呢？

还有一个问题：如果我就这样离开它不好吗？它有任何风险或类似的东西吗？

Answer 1

2021 年更新

您可以在项目设置 -> 高级中禁用目录列表（参见 docs）。

2021 年之前

您需要将 index.html 递归地添加到 _next 和每个子目录。您可以通过编写一个 post-build 脚本来完成它。

但是，这样做没有任何好处。公开此目录或其中的文件没有风险。

_next/static 只是编译客户端 public assets.

Answer 2

我也在寻找解决方案并尝试创建自定义 post-build 脚本但没有成功。我的最终解决方案是在根项目目录的 vercel.json 文件中创建重定向规则。

这是我的vercel.json

{
  "redirects": [
    {
      "source": "/_next",
      "destination": "/404",
      "statusCode": 404
    },
    {
      "source": "/_next/static",
      "destination": "/404",
      "statusCode": 404
    },
    {
      "source": "/_next/static/([A-z0-9_-]{21})",
      "destination": "/404",
      "statusCode": 404
    },
    {
      "source": "/_next/static/chunks",
      "destination": "/404",
      "statusCode": 404
    },
    {
      "source": "/_next/static/css",
      "destination": "/404",
      "statusCode": 404
    },
    {
      "source": "/_next/static/images",
      "destination": "/404",
      "statusCode": 404
    }
  ]
}

您可以在 Vercel Dashboard > 您的项目部署 > 源 > 输出中检查，如果您有其他目录要隐藏。

使用此配置部署站点后，当您访问该站点时将呈现 404 页面 URL。

如何在部署到 Vercel 的 Next js 中禁用目录列表

How to disable directory listing in Next js deployed to Vercel

next.js

vercel