将文件下载从受保护的路由传递到浏览器答案

【问题标题】：Pass a file download from protected route to browser将文件下载从受保护的路由传递到浏览器
【发布时间】：2017-03-31 16:26:05
【问题描述】：

我有一个 react 前端和一个 nodejs/express 后端。后端可以通过受保护的路由提供文件（下载）：

GET /api/file/:id

当前端想要开始文件下载时，它使用此代码向此端点发送请求（并且Authorization 标头设置为有效的token）：

axios.get(`${apiURL}/file/${id}`)
  .then(file => {
   ...
  })

后端使用以下代码响应：

router.get('/file/:id', requireAuth, = (req, res, next) => {
  ... 
  res.set('Content-Type', 'application/pdf');
  res.download(file.path, file.filename);
};);

这工作正常：下载开始并且二进制数据存在于.then() 调用的file 对象中。

我的问题：

我想在文件下载开始之前将文件传递给浏览器，而不是下载完整的文件，以便浏览器像通常的浏览器触发下载一样处理下载，浏览器会提示它应该下载还是显示文件。这怎么能做到……？

解决办法：

感谢@FakeRainBrigand 提示，我通过请求参数向路由添加了基于令牌的授权（使用护照策略）：

const jwtOptions = {
  jwtFromRequest: ExtractJwt.fromExtractors([
    ExtractJwt.fromHeader('authorization'),
    ExtractJwt.fromUrlQueryParameter('token'),
  ]),
  secretOrKey: secretKey,
};

现在我可以直接把下载传给浏览器来处理了：

window.location.href = `${apiURL}/file/${_id}?token=${token}`;

【问题讨论】：

标签： node.js file reactjs express download

【解决方案1】：

授权标头将在此处引起问题。您应该使用 cookie，至少对于此功能。否则，您必须在 URL 中包含一个令牌。

这两种解决方案是window.open 响应事件，或者导航到网址（例如location.href = '...'）。

至少在某些浏览器中，当有文件下载时，它们实际上不会导航，尽管您更改了位置。

【讨论】：