我使用PDFKit(无节点)在浏览器中生成PDF,并通过src属性显示iframe或embed标签。生成的blob URL是某种UUID。所以整个页面看起来像:


 < embed src =“blob:http:// localhost / eeaabb ...”/>&#xA ;


 PDF显示正常,但当我点击Chrome中的“下载”链接时,默认文件名是UUID。在FireFox中,它只是“document.pdf”。


如果这是服务器生成的PDF,我会使用Content-Disposition和/或操作URL,所以它的最后一部分是我想要的名字,但是使用客户端生成的对象似乎是可能的。


我尝试过的事情:


有没有办法围绕这个,以便我可以控制默认/建议的文件名?

答案 0 :(得分:1)
有什么方法可以控制这个名字吗?
没有。您无法控制存储在用户本地文件系统中的文件的名称。
您可以将<a>
元素与download
属性设置为建议的文件名。如果用户选择下载提供的文件,用户可以在下载文件之前或之后随时更改文件名。
window.onload = () => {
let blob = new Blob(["file"], {
type: "text/plain"
});
let url = URL.createObjectURL(blob);
let a = document.createElement("a");
a.href = url;
a.download = "file.txt";
document.body.appendChild(a);
console.log(url);
a.click();
}
在chrome,Chrome浏览器中,您可以使用requestFileSystem
将Blob
,File
或Directory
存储在LocalFileSystem
,将文件写入浏览器配置目录,用户操作系统中的其他目录。见
答案 1 :(得分:1)
我还没找到chrome的默认插件
我有一些适用于Firefox的东西,并且在Chrome中默认为download.pdf
,原因有些奇怪......
以
的形式传递dataURI'data:application/pdf;headers=filename%3D' + FILE_NAME + ';base64,...'
Firefox接受FILE_NAME作为您文件的名称,但Chrome不会......
plnkr ,以便在Chrome中显示更好的download.pdf
,它不喜欢嵌套的iframe ......
一个只能在FF中使用的片段:
const FILE_NAME = 'myCoolFileName.pdf';
const file_header = ';headers=filename%3D';
fetch('https://dl.dropboxusercontent.com/s/rtktu1zwurgd43q/simplePDF.pdf?dl=0').then(r => r.blob())
.then(blob=>{
const f = new FileReader();
f.onload = () => myPdfViewer.src = f.result.replace(';', file_header + encodeURIComponent(FILE_NAME) + ';');
f.readAsDataURL(blob);
});
<iframe id="myPdfViewer" width="500" height="500"></iframe>
但请注意,如果它对您来说非常重要,您当然可以不依赖浏览器自己的插件,并使用例如Mozilla's PDF.js来获得扩展控件。