通过XMLHttpRequest和window.open在浏览器中打开文件流pdf以及下载pdf

1、浏览器预览pdf:

首先通过接口获取文件流数据

下发是源码

var xhr = new XMLHttpRequest();

xhr.open("GET", 'http://www.baidut.com/downloadFile');

xhr.responseType = "blob";

xhr.onload = function(){

if(this.status == 200){

var blob = new Blob([this.response],{type: 'applocation/pdf;chartset=UTF-8'});

var url = window.URL.createObjectURL(blob);

window.open(url, "_blank");

}

};

xhr.send();

当然我这里使用的是原生的,如果可以的也可以使用axios、ajax都是可以的,反正都是通过接口获取文件流进而通过blob不同的类型转换用于浏览器的展示;blob的type有很多,还有图片image/png等等

2、浏览器下载文件:

浏览器下载文件和预览差不多

相关推荐
sleeppingfrog13 小时前
zebra打印机实现前端打印
前端
摇滚侠13 小时前
前端判断不等于 undefined 不等于 null 的方法
前端
DFT计算杂谈13 小时前
VASP+Wannier90 计算位移电流和二次谐波SHG
java·服务器·前端·python·算法
zhougl99613 小时前
Vue 中使用 WebSocket
前端·vue.js·websocket
无名的小白13 小时前
openclaw使用nginx反代部署过程 与disconnected (1008): pairing required解决
java·前端·nginx
ComPDFKit13 小时前
ComPDF的产品升级:从工具包到PDF服务
pdf
2601_9498574313 小时前
Flutter for OpenHarmony Web开发助手App实战:文本统计
前端·flutter
光影少年14 小时前
智能体UI ux pro max
前端·ui·ux
半梅芒果干14 小时前
vue3 实现无缝循环滚动
前端·javascript·vue.js
qq_4198540514 小时前
锚点跳转及鼠标滚动与锚点高亮联动
前端