前端处理后端传来的文件流实现下载或预览

直接下载

var url = this.GLOBAL_URL + "/api/GetFile?id=" + id;		// 请求的url + id
var xhr = new XMLHttpRequest();
xhr.open("GET", url, true)
xhr.responseType = "blob";
xhr.setRequestHeader("client_type", "DESKTOP_WEB");
xhr.setRequestHeader("Authorization", token);			// 自定义请求头
xhr.onload = function(){if(this.status == 200){var blob = this.response;var fileName = filename;if(window.navigator.msSaveOrOpenBlob){			// IE浏览器下navigator.msSaveBlob(blob, fileName);} else {var  link = document.createElement("a");link.href = window.URL.createObjectURL(blob);link.download = fileName;link.click();window.URL.revokeObjectURL(link.href);}}
};
xhr.send()

在线预览

在线预览我们需要借助pdf.js，下载地址：https://github.com/wwjhzc/pdf

打开pdf文件，找到viewer.js，搜索 var DEFAULT_URL 把内容置空，即 var DEFAULT_URL = ‘’;
使用： window.open(’/static/pdf/web/viewer.html?file=’ + window.URL.createObjectURL(blob))

xhr.onload = function(){if(this.status == 200){var blob = this.response;var fileName = filename;window.open('/static/pdf/web/viewer.html?file=' + window.URL.createObjectURL(blob))}
};