相关疑难解决方法(0)

在我的Vue应用程序中,我收到PDF作为blob,并希望使用浏览器的PDF查看器显示它.

我将其转换为文件,并生成一个对象url:

const blobFile = new File([blob], `my-file-name.pdf`, { type: 'application/pdf' })
this.invoiceUrl = window.URL.createObjectURL(blobFile)

然后我通过将该URL设置为data对象元素的属性来显示它.

<object
  :data="invoiceUrl"
  type="application/pdf"
  width="100%"
  style="height: 100vh;">
</object>

然后,浏览器使用PDF查看器显示PDF.但是,在Chrome中,我没有使用我提供的文件名(此处为my-file-name.pdf):我在PDF查看器的标题栏中看到一个哈希值,当我使用"右键单击"下载文件时- >另存为...'或查看器的控件,它使用blob的哈希(cda675a6-10af-42f3-aa68-8795aa8c377d或类似)保存文件.

浏览器和文件名的工作方式与我在Firefox中所希望的一样; 它只是不使用文件名的Chrome.

有没有办法,使用原生Javascript(包括ES6,但没有Vue以外没有第三方依赖),为Chrome中的blob/object元素设置文件名？

[edit]如果有帮助,则响应具有以下相关标头:

Content-Type: application/pdf; charset=utf-8
Transfer-Encoding: chunked
Content-Disposition: attachment; filename*=utf-8''Invoice%2016246.pdf;
Content-Description: File Transfer
Content-Encoding: gzip

基本上，我正在做的是在服务器上生成一个 PDF 文件并通过这样的 javascript 在浏览器中显示它：

  file = new window.Blob([data], { type: 'application/pdf' });
  var fileUrl = URL.createObjectURL(file);
  var wnd = window.open(fileUrl, "_blank", "location=no, fullscreen=yes, scrollbars=auto, width=" + screen.width + ",height=" + screen.height);

所有这些工作正常，但每个浏览器都显示一个丑陋的副标题（类似这样）：blob:2da57927-311e-4b3d-a261-d2679074802c

有什么办法可以去掉这个副标题或者用一些有意义的东西代替它吗？

编辑： 这是改进代码的屏幕截图（在应用 VisioN 的建议后）：