HTML5中的<a>标签可以通过下载属性来指定文件的下载链接。当用户点击该链接时,浏览器会自动下载该文件。然而,如果服务器返回的响应状态码是错误的(如404 Not Found),浏览器默认会打开该文件而不是下载。
要解决这个问题,可以通过以下几种方式来处理:
示例代码(Node.js):
res.setHeader('Content-Disposition', 'attachment; filename="filename.ext"');
示例代码:
fetch('file-url')
.then(response => {
if (!response.ok) {
throw new Error('Server error');
}
return response.blob();
})
.then(blob => {
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'filename.ext';
link.click();
URL.revokeObjectURL(url);
})
.catch(error => {
console.error(error);
});
在上述代码中,我们使用fetch函数来获取文件的Blob对象。如果服务器返回的响应状态码是错误的,我们抛出一个错误。然后,我们使用URL.createObjectURL函数创建一个临时URL,并将其赋值给a标签的href属性。最后,通过调用a标签的click方法来触发下载。
推荐的腾讯云相关产品:腾讯云对象存储(COS)
领取专属 10元无门槛券
手把手带您无忧上云