背景：pdf文件存储在服务端文件名都是id命名的。使用chrome自带的文件预览下载时导出的文件名也是id.pdf。需要下载的文件名是源文件上传时的文件名。
方案：pdf.js 修改部分源码
2.将下载好的文件中的build和web拷贝到vue项目的public文件夹下
image.png
3.修改viewer.js的getPDFFileNameFromURL方法
function getPDFFileNameFromURL(url) {
// 添加如下三行代码
let customUrl = decodeURIComponent(window.location.href)
let filename = new URL(customUrl).searchParams.get('filename') || ''
if (filename) return filename
var defaultFilename = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'document.pdf';
if (isDataSchema(url)) {
console.warn('getPDFFileNameFromURL: ' + 'ignoring "data:" URL for performance reasons.');
return defaultFilename;
}
var reURI = /^(?:(?:[^:]+:)?\/\/[^\/]+)?([^?#]*)(\?[^#]*)?(#.*)?$/;
var reFilename = /[^\/?#=]+\.pdf\b(?!.*\.pdf\b)/i;
var splitURI = reURI.exec(url);
var suggestedFilename = reFilename.exec(splitURI[1]) || reFilename.exec(splitURI[2]) || reFilename.exec(splitURI[3]);
if (suggestedFilename) {
suggestedFilename = suggestedFilename[0];
if (suggestedFilename.indexOf('%') !== -1) {
try {
suggestedFilename = reFilename.exec(decodeURIComponent(suggestedFilename))[0];
} catch (ex) {}
}
}
return suggestedFilename || defaultFilename;
}
4.使用的时候url上拼接上filename参数
const href = pdf文件资源路径
const filename = 需要下载的文件名
window.open(`./pdf/web/viewer.html?file=${encodeURIComponent(href)}&filename=${filename}`);
