jquery中pdf的上传、下载及excel导出
jquery中pdf的上传、下载及excel导出
- 1.PDF上传 pdfUpload
- 2. pdf下载和excel导出用的一种方法，并且需要引入utils.js
-
- 2.1PDF下载 pdfDownload
- 2.2导出Excel excelExport
1.PDF上传 pdfUpload
//PDF上传 pdfUpload
window.pdfUpload=function (obj){
layer.open({
type: 1,
title: "PDF上传",
shade: 0.1,
area: ['250px', '155px'],
// btn: ['确认','取消'],
content:
`
`
, success: function (layero, index) {
$(':focus').blur();
upload.render({
elem: '.demo-class-accept'
, url: rootPath + '/xxxxxx'
, accept: 'file'
, data: {schedulingId: obj.data.id}
, exts: 'pdf'
, done: function (res) {
console.log(res,' upload.render--res')
if (res) {
if (res.code == "200") {
layer.msg('上传成功',{time:2000});
setTimeout(function (){
layer.close(index)
},2000)
} else {
layer.msg(res.msg, {icon: 2, time: 3000});
}
}
}
});
}
});
}
2. pdf下载和excel导出用的一种方法，并且需要引入utils.js
<script th:src="@{/static/utils.js}"></script>
// utils.js
const download = (res, type, filename) => {
// 创建blob对象，解析流数据
const blob = new Blob([res], {
// 如何后端没返回下载文件类型，则需要手动设置：type: 'application/pdf;chartset=UTF-8' 表示下载文档为pdf，如果是word则设置为msword，excel为excel
type: type
})
const a = document.createElement('a')
// 兼容webkix浏览器，处理webkit浏览器中href自动添加blob前缀，默认在浏览器打开而不是下载
const URL = window.URL || window.webkitURL
// 根据解析后的blob对象创建URL 对象
const herf = URL.createObjectURL(blob)
// 下载链接
a.href = herf
// 下载文件名,如果后端没有返回，可以自己写a.download = '文件.pdf'
a.download = filename
document.body.appendChild(a)
a.click()
document.body.removeChild(a)
// 在内存中移除URL 对象
window.URL.revokeObjectURL(herf)
}
2.1PDF下载 pdfDownload
//PDF下载 pdfDownload
window.pdfDownload=function (obj){
$.ajax({
url: rootPath + '/xxxx?schedulingId='+obj.data.id,
type: 'get',
success: function (res) {
if (res.code == 200) {
var pdfUrl = res.data ? (res.data.pdfUrl ? res.data.pdfUrl : null) : null
if (pdfUrl) {//有返回pdf地址
let type=pdfUrl.split('.').pop();
let fileExtName = "";
if(type=='pdf'){
fileExtName=".pdf"
}else {
layer.msg("请导入的非Excel文件！")
}
let randfile = new Date().getTime() + fileExtName;
var oReq = new XMLHttpRequest();
oReq.open("GET", pdfUrl, true,);
oReq.responseType = "blob";
oReq.onload = function () {
var file = new Blob([oReq.response], {
type: 'application/pdf'
});
saveAs(file, randfile);
};
oReq.send();
}
else{
layer.msg("请先上传pdf数据！")
}
}
}
})
}
function saveAs(data, name) {
var urlObject = window.URL || window.webkitURL || window;
var export_blob = new Blob([data]);
var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a')
save_link.href = urlObject.createObjectURL(export_blob);
save_link.download = name;
save_link.click();
}
//function getFileName(url)
//{
// var num = url.lastIndexOf('/')+1
// var fileName = url.substring(num)
// //把参数和文件名分割开
// fileName = decodeURI(fileName.split("?")[0]);
// return fileName;
//}
2.2导出Excel excelExport
//导出Excel excelExport
window.excelExport=function (obj){
$.ajax({
url: rootPath + '/xxxx?schedulingId='+obj.data.id,
type: 'get',
success: function (res) {
if (res.code == 200) {
var excelUrl=res.data ? res.data : null
if (excelUrl) {//有返回pdf地址
let type=excelUrl.split('.').pop();
let fileExtName = "";
let blobType=""
if(type==''){//空
layer.msg("请导入的非Excel文件！")
return false
}else if(type=='xls'){
fileExtName=".xls"
blobType="application/vnd.ms-excel"
}else if(type=='xlsx'){
fileExtName=".xlsx"
blobType="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
}
var randfile = new Date().getTime() + fileExtName;
var oReq = new XMLHttpRequest();
oReq.open("GET", excelUrl, true,);
oReq.responseType = "blob";
oReq.onload = function () {
var file = new Blob([oReq.response], {
type: blobType
});
// saveAs(file, "excelFile.xls");
saveAs(file, randfile);
};
oReq.send();
}
else{
layer.msg("请先上传Excel数据！")
}
}
}
})
}
function saveAs(data, name) {
var urlObject = window.URL || window.webkitURL || window;
var export_blob = new Blob([data]);
var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a')
save_link.href = urlObject.createObjectURL(export_blob);
save_link.download = name;
save_link.click();
}
参考：
https://blog.csdn.net/qq_27179087/article/details/129204759
https://blog.csdn.net/weixin_46186815/article/details/131514151?spm=1001.2101.3001.6650.1&utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1-131514151-blog-123522384.235%5Ev38%5Epc_relevant_anti_vip_base&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7ERate-1-131514151-blog-123522384.235%5Ev38%5Epc_relevant_anti_vip_base&utm_relevant_index=2
https://blog.csdn.net/qq_40636998/article/details/107239922?utm_medium=distribute.pc_relevant.none-task-blog-2defaultbaidujs_baidulandingword~default-9-107239922-blog-130881581.235v38pc_relevant_anti_vip_base&spm=1001.2101.3001.4242.6&utm_relevant_index=12