axios接收application/octet-stream,blob格式下载,添加下载名称
时间: 2023-08-05 18:41:07 浏览: 157
vue实现文件分割与合并
好的,如果您想要添加下载名称,可以在响应头中设置 `Content-Disposition` 属性,具体代码如下:
```javascript
axios({
url: 'your_file_url',
method: 'GET',
responseType: 'blob'
}).then(response => {
const url = window.URL.createObjectURL(new Blob([response.data]));
const link = document.createElement('a');
link.href = url;
const contentDisposition = response.headers['content-disposition'];
const fileNameMatch = contentDisposition && contentDisposition.match(/filename="(.+)"/);
const fileName = fileNameMatch && fileNameMatch[1] ? fileNameMatch[1] : 'unknown';
link.setAttribute('download', fileName);
document.body.appendChild(link);
link.click();
});
```
在上述代码中,我们首先发送一个 GET 请求,并将 `responseType` 设置为 `blob`,以便我们可以接收到一个 Blob 格式的文件。然后,我们创建一个 `<a>` 标签,并将其 `href` 属性设置为 URL 对象的地址。接下来,我们从响应头中获取 `Content-Disposition` 属性,并使用正则表达式提取出文件名。如果无法提取出文件名,则将文件名设置为 "unknown"。最后,我们将文件名作为下载属性的值,并将该标签添加到 DOM 中,并模拟点击该标签,从而触发浏览器的文件下载功能。
希望这可以解决您的问题,如果还有其他问题,请继续提问。
阅读全文