目前有一个需求,web网页改h5页面嵌套到其他手机app页面中,在pc浏览器调试时,可以下载文件,但是打包集成到app里时点击下载按钮却没有反应,无法调试也不知道出了啥问题。下面是代码,用的是vue2,是在后台管理系统项目里写的,那边app是用iframe来显示我网页的,有没有兄弟有经验的来说说!
this.$http({
url: this.$http.adornUrl(
`/robot/acceptFailedStatistic/downloadStatistic`
),
method: "get",
responseType: "arraybuffer",
params: this.$http.adornParams({
staffId: this.staffId,
bussinessType: this.bussinessType,
downloadExeclType: 2,
time,
}),
}).then((res) => {
let headers = res.headers;
let blob = new Blob([res.data], { type: headers["content-type"] });
let link = document.createElement("a");
link.href = window.URL.createObjectURL(blob);
const fileName = decodeURI(headers["content-disposition"]);
if (fileName.includes("filename=")) {
let title = fileName.split("=")[1];
link.download = title;
link.click();
this.downloadShow = false;
this.shows = false;
} else {
this.$message.error("下载出错");
}
});
app中下载功能调用原生的提供的方法可实现
如果是用网页传输数据过渡的话,网页需要获取一下用户的token 和一些参数才行,这里需要注意一下iframe 默认是get请求,使用的时候记得嵌套一个form标签,这样才能变成post 请求,如有帮助记得采纳
你这个问题很明显就是app端的浏览器不兼容你的这个下载方法
最快的解决办法就是让后台改一下,不使用文件流的下载方式,而是后台把文件创建好放到服务器上,直接返回给你一个下载地址,但是这样会在服务器上生成很多垃圾文件