Javascript 使用vue js中的axios post方法下载文件
我正在尝试使用axios post方法下载一个文件,看起来一切正常,但是 打开文件时,我将遇到此错误 这是我的网络选项卡: 请求标头:Javascript 使用vue js中的axios post方法下载文件,javascript,ajax,laravel,vue.js,axios,Javascript,Ajax,Laravel,Vue.js,Axios,我正在尝试使用axios post方法下载一个文件,看起来一切正常,但是 打开文件时,我将遇到此错误 这是我的网络选项卡: 请求标头: Host: 127.0.0.1:8000 User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:75.0) Gecko/20100101 Firefox/75.0 Accept: application/json, text/plain, */* Accept-Language: en-US,en;q
Host: 127.0.0.1:8000
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:75.0) Gecko/20100101 Firefox/75.0
Accept: application/json, text/plain, */*
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
X-Requested-With: XMLHttpRequest
Content-Type: application/json;charset=utf-8
Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJSUzI1NiJ9.eyJhdWQiOiIxIiwianRpIjoiYzQwYmI3MWE3MDg2MTI5YjE4OWI1NWVmODg3N2QzZTEzYTU0ODhkYTJhNDgwZDc3NTZkOTFiMzlmZWU3M2RjNDliNjE0YTBkZDc3M2U2NTUiLCJpYXQiOjE1ODY2ODQ1MTgsIm5iZiI6MTU4NjY4NDUxOCwiZXhwIjoxNjE4MjIwNTE4LCJzdWIiOiIyIiwic2NvcGVzIjpbXX0.BBKzN7cnHVGu1S5woLF3XWzb63uzjeZpVCA437LqmFJ7evPMEm9hZ8S3zd1kWvBPHieDwaUYEypWSyP1mH8PwhgVuZa3oMMlx_80BzApPoWFVQR6DeMZowQKuH71Wi7dEsLJb_F3bJXddgYwuB9m7Gsxb4tTo5zyrEx7GzMqCusGvQfr0qfs-0iUW7wMXQ2GxeiS-Ae7mBCK361lDJauC3ozGjaLi-NQ5Gg9wb9dat4NdSp9tAall2f7-BUlOtTV2H8fOIIl5tI8cFBQaloyXWMIvk7dX8PVxxjAT9DzPYJ8rLFSRYvG_ZRkyXL-QMdr0MuXHp5UIC595UlW67JqraPTR0AMaCaviL5jKAWMtcmdsW7lVT3nxfQz-8Pg6hd9g-a_cc-Npd3qqrch6_sdQv_OLh3BQeWHbwLgRD5m5UGSzoIPhQG6BeB77EeqRMNlUQ2wErB4qEXGT13A-J39RjBpTvNSsNtrtkloOYFrSb0i7uGWHjZLp6Bm2qv_h37aGDAjowTLChHJ6_0YSkOqWg4ReADQf7XOyE6mTDYGW_9j7XuCdBi2EDv0E1hkWWV0G-ZCV15qtPoRBi9LcB9aR_eaSohvfzpyhI1Lqn8fJWSzWqorN2nqooUhuXCh3UcqZksn8vIES1OWUWHSfeKpMGe3kxlPA5_3tPfMXtm2IAc
X-XSRF-TOKEN: eyJpdiI6ImVtaGEyYXN4Q1wvQkdkb3M3UGZ5eTNBPT0iLCJ2YWx1ZSI6IkR5WE5RUHczM1ExMVIwc1NGK09kaXNsSyttTDNhY1JicWlDT1hDOU1GbU9FWllIY2lDdVJkdDF1VG8yQkd6QmciLCJtYWMiOiJlODE3ODAwYzUxMTUwZTNlYzYyZmIxOTI3MDE5ZWNjMWNhNGJjMjFlMmIxYmU4NGMxMWE1YTFiMjc0NGZkMjk0In0=
Content-Length: 69
Origin: http://127.0.0.1:8000
Connection: keep-alive
Referer: http://127.0.0.1:8000/
Cookie: XSRF-TOKEN=eyJpdiI6ImVtaGEyYXN4Q1wvQkdkb3M3UGZ5eTNBPT0iLCJ2YWx1ZSI6IkR5WE5RUHczM1ExMVIwc1NGK09kaXNsSyttTDNhY1JicWlDT1hDOU1GbU9FWllIY2lDdVJkdDF1VG8yQkd6QmciLCJtYWMiOiJlODE3ODAwYzUxMTUwZTNlYzYyZmIxOTI3MDE5ZWNjMWNhNGJjMjFlMmIxYmU4NGMxMWE1YTFiMjc0NGZkMjk0In0%3D; laravel_session=eyJpdiI6ImJjSGQ3bFR3QlpsQnhuN2tVNzZDRGc9PSIsInZhbHVlIjoiUmkzeWJnUURDdld1bitaUlwvVXNxbzgwNU56SkRFcExQbXlhdVpXZlorRW1RaFRcL1p4dlh0TjZMZVVmNDBKTkhXIiwibWFjIjoiOGNmY2Q2OTdkNmFkNWNkMTAxNTBlYTMwNTlhZGMwYTBiNGU2MDM5NWFkODkyNjY0OTQ2MjNiMGY3Y2RlMGE4MiJ9
响应头
服务器端Laravel:
$path=$request->file;
if(Storage::exists($path))
{
$file=Storage::get($path);
$type=Storage::mimeType($path);
$response = Response::make($file, 200);
$response->header("Content-Type", $type);
return $response;
}
客户端Vue:
axios.post('/api/downloadFile',{'file':item}).then(res=>{
let blob = new Blob([res.data], { type: res.headers['content-type'] });
let link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download =item.slice(item.lastIndexOf('/')+1);
link.click()
}).catch(err=>{
})
当您指定responseType时,它工作吗 axios.post“/api/downloadFile”, {“文件”:项}, {responseType:'blob'} .thenres=>{ 设blob=newblob[res.data],{type:res.headers['content-type']}; 让link=document.createElement'a'; link.href=window.URL.createObjectURLblob; link.download=item.sliceitem.lastIndexOf'/'+1; link.click }.catcherr=>{}