如何知道一个文件的扩展名，以便能够在react (javascript)中正确下载?

Question

我正在下载文件。问题是，我不知道如何得到它的扩展，他们加载我不正确，另一方面，如果当我把它的名字我写的扩展(知道它是什么)，它是正确下载。问题是，在应用程序中，你不知道收到的是什么类型的文件，你可以得到pdf, jpg，…我所做的就是从NodeJS后端请求AWS S3接收文件，然后将其发送到react的前端。

下面是后台代码:

routerTrainer.get("/download-training", async (req, res) => {
const { training_id } = req.headers;
let training = await Training.findOne({
where: { id: training_id },
});
if (training) {
let readStream = getTrainingS3(`${training.file_id}`);
readStream.on('close', () => {
res.end()
})
readStream.pipe(res);
}
});

下面是客户端代码:

const downloadTraining = async (id) => {
fetch(`${serverPath}/download-training`, {
headers: {
training_id: id,
},
})
.then((res) => res.blob())
.then((blob) => {
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
link.setAttribute("download", `here_is_where_I_need_to_put_extension_to_get_it_working`);
document.body.appendChild(link);
link.click();
});
};

如果有人对如何做有任何想法，我将非常感谢你的帮助。

Answer 1

如果我理解正确，您的文件在S3中。这使得你的方法在这里无效。S3有一种非常特殊的上传和下载文件的方法那就是通过"预签名url"如果你使用标准方法，你就不会首先面对你所面临的问题。

关于预签名url的更多信息:https://aws.amazon.com/blogs/developer/generate-presigned-url-modular-aws-sdk-javascript/

但是大意是这样的:

1. UI向后端发出请求
2. 后端生成一个预签名的S3 URL(注意，为了使其正常工作，您需要有IAM权限来获取对象)。这基本上是一个特殊的S3 URL，只在接下来的几分钟内工作，并允许用户上传或下载文件(取决于您如何配置预签名URL)
3. 后端使用生成的URL向UI发送响应
4. UI执行后续请求，现在下载文件。因此，下载实际上直接从S3进行，完全跳过了您的web应用程序。这也使得以后扩展应用程序变得容易得多。尤其是……Node.js应用程序并不能很好地处理太多的并行负载，因为所有的东西都在一个线程中运行。

所以，为了回答最初的问题，您在S3上的文件可能有一个扩展名。当您生成预签名URL时，该URL将包含完整的文件名以及扩展名，因此您不必真正担心它。