后端返回文件地址,下载txt,pdf等类型文件
目录
后端返回文件地址,下载txt,pdf等类型文件
<p
v-for="item in list"
:key="item.id"
@click="down(item)"
>
{{ item.file_name }}
</p>
list为文件列表,通过接口获得文件地址
const down= (item) => {
const x = new XMLHttpRequest();
x.open("GET", url, true); //url为文件地址 (请求地址 + item.file_url)
x.responseType = "blob";
x.onload = () => {
const url = URL.createObjectURL(x.response);
const a = document.createElement("a");
a.href = url;
a.download = item.file_name;
a.target = "_blank";
a.click();
};
x.send();
};
点击之后可能会显示跨域问题
前端解决有些麻烦,后端配置一下跨域
最后请求netWork显示有
txt文件和PDF文件类型的就也可以直接被下载,不会跳转打开预览