有关谷歌下载PDF文件而不是直接打开预览的问题
找了很多帖子,都不行,
解决方法把链接处理成blob文件再调用下载。
但是仍然不行,最终原因找到:
缺少了这一部创建,需要把二进制数据重新用 Blob对象申明下
let data = new Blob([blob], {
type: "application/pdf;charset=UTF-8",
});
下面是方法:
// 下载
downloadFile(file) {
let url = this.handleImg(file);
this.getBlob(url).then((blob) => {
// 成功后下载
this.saveAs(blob, file);
});
},
// 链接转换blob文件
getBlob(url) {
return new Promise((resolve) => {
const xhr = new XMLHttpRequest();
xhr.open("GET", url, true);
xhr.responseType = "blob";
xhr.onload = () => {
if (xhr.status === 200) {
resolve(xhr.response);
}
};
xhr.send();
});
},
// 下载pdf
saveAs(blob, filename) {
let a = document.createElement("a");
let data = new Blob([blob], {
type: "application/pdf;charset=UTF-8",
});
a.style.display = "none";
a.download = filename;
a.href = URL.createObjectURL(data);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
window.URL.revokeObjectURL(a.href); //释放内存
},
补充:之后下载可以了,但是发现发下载下来打开后全是空白页
查询了一番找到的结果都是:
需要设置 responseType: 'blob' ,但是这里已经设置了还是不行,无奈认为是不是ajax的写法有问题,又换成 axios 试也不行,然后又再百度搜,搜啊搜,终于。。。
找到了一篇帖子。说 mockJs 可能会影响,给相应拦截的 responseType修改为” “ ,所以导致原先设置的 responseType: 'blob' 无效,也就进而导致了空白页(IE上面是乱码)
原文地址:https://www.cnblogs.com/jdWu-d/archive/2020/07/31/13410664.html
然后去入口文件搜索,果然看到有引入 mock js , 直接两个 ”//“, 问题就解决了。
最终 axios的代码如下:
// 下载
downloadFile(file) {
let url = this.handleImg(file);
axios({
method: "get",
url: url,
responseType: "blob",
headers: { "Content-Type": "blob" },
}).then((res) => {
console.log(res);
this.saveAs(res.data, file);
});
},
// 下载pdf
saveAs(blob, filename) {
let data = new Blob([blob], {
type: "application/pdf;charset-UTF-8",
});
let a = document.createElement("a");
a.style.display = "none";
a.download = filename;
a.href = URL.createObjectURL(data);
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
window.URL.revokeObjectURL(a.href); //释放内存
},
responseType:'blob'
有关谷歌下载PDF文件而不是直接打开预览的问题的更多相关文章
- HTML 单击a标签 实现下载文件而不是浏览器打开预览
<a d ownload class="down" title="">
- 纯前端下载pdf链接文件,而不是打开预览的解决方案
纯前端下载pdf链接文件,而不是打开预览的解决方案 一,介绍与需求 1.1,介绍 XMLHttpRequest 用于在后台与服务器交换数据.这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行 ...
- 阿里云OSS下载pdf文件,并在pdf文件上添加水印
代码: 兵马未动,粮草先行 作者: 传说中的汽水枪 如有错误,请留言指正,欢迎一起探讨. 转载请注明出处. 公司要求从阿里云OSS下载pdf文件并且需要添加水印. 因此这里总结一下. 首先添加了一个F ...
- 使用java的 htpUrlConnection post请求 下载pdf文件,然后输出到页面进行预览和下载
使用java的 htpUrlConnection post请求 下载pdf文件,然后输出到页面进行预览和下载 2018年06月07日 10:42:26 守望dfdfdf 阅读数:235 标签: jav ...
- 知网下载pdf文件的方法
title: 知网下载pdf文件的方法 toc: false date: 2018-11-02 17:54:43 categories: methods tags: 知网 平时我们使用的是国内版的知网 ...
- 从七牛服务下载PDF文件
/** * 从七牛下载PDF文件 * @param request * @param response * @param exhiId * @throws MalformedURLException ...
- 下载apk文件浏览器会直接打开并显示乱码的问题
今天同事反映他的apk文件在自己的老项目中下载有问题:下载apk文件浏览器会直接打开并显示乱码,在别的项目中就没有问题. 后分析response的content-type发现,老项目的类型是text/ ...
- 谷歌发布 Android 8.1 首个开发者预览版,优化内存效率
今晨,谷歌推出了 Android 8.1 首个开发者预览版,此次升级涵盖了针对多个功能的提升优化,其中包含对 Android Go (设备运行内存小于等于 1 GB)和加速设备上对机器学习的全新神经网 ...
- 项目中的那些事---下载pdf文件
最近做了一个下载pdf文档的需求,本以为使用HTML5中<a>标签的属性download就能简单搞定,不料IE竟然不支持这一简单粗暴的H5新特性,而是直接在网页中打开, 于是各种搜索之后得 ...
- android默认浏览器response下载PDF文件
下载出来的文件不是PDF,而是xxx.htm文件,原因是response的header配置有问题. android默认浏览器的情况下,header的配置应该写成.(java 为例) response. ...
随机推荐
- 连号区间数【第四届蓝桥杯省赛C++B组,第四届蓝桥杯省赛JAVAB组】
连号区间数 小明这些天一直在思考这样一个奇怪而有趣的问题: 在 \(1∼N\) 的某个排列中有多少个连号区间呢? 这里所说的连号区间的定义是: 如果区间 \([L,R]\) 里的所有元素(即此排列的第 ...
- [WPF]ICommand最佳使用方法
public class RelayCommand:ICommand { private Predicate<object> _canExecute; private Action< ...
- 跟我学Python丨图像增强及运算:局部直方图均衡化和自动色彩均衡化处理
摘要:本文主要讲解图像局部直方图均衡化和自动色彩均衡化处理.这些算法可以广泛应用于图像增强.图像去噪.图像去雾等领域. 本文分享自华为云社区<[Python从零到壹] 五十四.图像增强及运算篇之 ...
- 腾讯出品小程序自动化测试框架【Minium】系列(四)API详解(上)
写在前面 不知道是不是因为之前出过书的原因,在写教程之类的文章,会潜意识有自带目录和章节的感觉在里面,有点说不出的感觉吧. 上篇文章我们介绍了关于元素定位的使用方法,这篇文章将为大家分享关于Miniu ...
- djiango路由匹配、djiango路由层、反向解析、有名无名反向解析
djiango路由匹配.djiango路由层.反向解析.有名无名反向解析 一.作业讲解(数据的增删改查) urls代码 from django.contrib import admin from dj ...
- 教你解决虚拟机用不了USB设备的苦恼。
如果你看见了上图的效果说明我们的苦恼是一样一样的. vm10 vm11 vm player都有这个问题!!!! 对不对?哈哈 . 在虚拟机右击设备点击连接(Connect) 然后听见你的电脑发出了硬 ...
- exgcd & 线性同余方程
前置芝士 裴蜀定理 同余的性质 exgcd exgcd即扩展欧几里得定理,常用来求解\(ax + by = gcd(a,b)\)的可行解问题 推导过程: 考虑我们有: \(ax + by = gc ...
- idea debug---启动超级慢,提示”Method breakpoints may dramatically slow down debugging“的解决办法
https://blog.csdn.net/hanqing456/article/details/111878982 1.问题项目正常启动的时候没问题,debug模式就卡住了,很久不动.我推测是哪个断 ...
- GitHub实用开源项目
第一款 JSON Crack JSON Crack 是一个很方便的 JSON 数据可视化工具. 该项目不是简单的展示 JSON 数据,而是将其转化为类似思维导图的形式,支持放大/缩小.展开/收缩.搜索 ...
- Python装饰器实例讲解(三)
Python装饰器实例讲解(三) 本文多参考<流畅的python>,在此基础上增加了一些实例便于理解 姊妹篇 Python装饰器实例讲解(一),让你简单的会用 Python装饰器实例讲解( ...