如何在不暴露完整的“/static”文件夹的情况下在 express 中提供单个静态文件？

Question

我正在创建一个使用 JWT 的非常简单的项目。 我通过快递提供所有服务，我没有前端和后端。 我想要做的是根据用户的授权提供特定的 html 文件（在https://localhost:3000入口点 server.js 上提供服务）

人们一直推荐使用（server.js）：

app.use(express.static('static'))

但这当然不起作用，因为我可以通过访问https://localhost:3000/whatever.i.want来访问任何这些文件。

我也试过（server.js）：

app.use( '/secret' , authMiddleware, function(req,res){
    if(auth){
      res.sendFile(__dirname + '/static/secret.html')
    }
});

但是在我的样式表和脚本上给出了 404，以及一些奇怪的 MIME 类型错误

拒绝将https://localhost:3000/script.js作为脚本执行，因为给出了“X-Content-Type: nosniff”并且它的 Content-Type 不是脚本 MIME 类型。

如果我添加它，它会起作用：

app.get( '/styles.css' , function(req,res){
  res.sendFile(__dirname + '/static/styles.css')
});

app.get( '/script.js' , function(req,res){
  res.sendFile(__dirname + '/static/script.js')
});

但是我真的必须为我使用的每个样式表和脚本都这样做吗？ 一定有更好的方法！！！

1.) 人们这样做的最佳方式是什么？ 具体来说，是否可以在不使用前端并从后端提供所有静态文件的情况下创建授权的 Web 应用程序？

2.) 你的静态目录是否有必要公开访问？ 这意味着您只能在某些端点上投射授权约束，然后使用调用这些端点的脚本文件？ 这仍然允许您查看基本 HTML，而不是 API 调用的任何结果。 这实际上有效，但很糟糕。

文件系统

server.js
/static
  /blah.html
  /secret.html
  /secret.css
  /secret.js

Answer 1

如果您想有选择地从 express 服务器提供资产，您可以执行以下操作：

let secrets = ['secrets.html', 'my_diary.html']

app.use((req, res, next) => {
    let shouldBeAuthorised = secrets.some(s => req.url.includes(s))
    if (shouldBeAuthorized)
        // check they are authorized to be served this content
    else
        // just serve the content, carry on... no need to worry
})

app.use(express.static('static'))

我对req.url.includes使用非常不稳定，并且文件列表更复杂，可能会导致您需要对未明确列入黑名单的文件进行授权......但上述代码的基本结构应该可以实现你想要达到的目标。

Answer 2

您可以通过创建一个名为 public 的文件夹来解决此问题，您可以将所有 css、js 放在该文件夹中。 并使用静态中间件服务公共文件夹

app.use(express.static('public'))

然后是另一个名为 secret 的文件夹，您将在其中构建路由、验证 JWT 令牌并根据用户权限提供 html 文件