javascript - AngularJS 在新选项卡中打开 PDF 并更改文件名/url

Question

在我的 AngularJS 网站中，我想加载 .pdf 文档并在新的浏览器选项卡中显示它们。以下代码有效，但有些事情让我困扰:

createdObjectURL 设置为文档和浏览器选项卡的标题。这意味着我的文档的标题总是像 01d9bdca-9af2-43f0-a83f-f36fd82fd72 这样的标题，这并不是很体面。而且可见的 URL 也不好。最好使用我在 service.js 中调用的 URL，而不是 blob:http://localhost:8080/01d9bdca-9af2-43f0-a83f-f36fd82fd72f。

我尝试处理 HttpHeaders 中的文件名，但这根本没有效果:(

另一个奇怪的事情:如果我不指定 {responseType: "arraybuffer"}，PDF 标题将正确显示。但没有任何内容，文档是空的。

任何有关如何更改文件名和/或 URL 的帮助将不胜感激。谢谢。

JS Controller

DocumentService.getDocument().then(function(response) {
  $window.open(response, '_blank');
});

JS服务

return {
  getDocument : function () {
    return $http.get("document", {responseType: "arraybuffer"})
      .then(function(response) {
        var file = new Blob([response.data], {type: "application/pdf"});
        var fileURL = URL.createObjectURL(file);
        return fileURL;
      }
  }
}

Spring MVC ReST-服务

@RequestMapping(value = "/document", method = RequestMethod.GET)
public ResponseEntity<byte[]> getDocument(){
  try {
    File file = new File("C:\\pathToFile.pdf");
    byte[] fileContent = new byte[(int) file.lenth()];

    HttpHeaders heraders = new HttpHeaders();
    headers.setContentType(MediaType.parseMediaType("application/pdf"));
    String filename = "NameOfFile.pdf";
    headers.setContentDispositionFormData(filename, filename);  //doesn't change anything

    fileContent = File.readAllBytes(file.toPath());

    ResponseEntity<byte[]> response = new ResponseEntity<byte[]>(fileContent, headers, HttpStatus.OK);

    return response;
  } catch (FileNotFoundException e ) {
    System.err.println("File not found " + e);
  } catch (IOException e ) {
    System.err.pringln("Error while reading file " + e);
  }
}

简短版本:当 PDF 文件作为字节数组加载并使用 AngularJS $window 指令在新的浏览器选项卡中显示时:是否有可能更改文件名和 URL？

Answer 1

打开一个新选项卡，其中包含返回字节数组的资源的 URL!像这样的东西:

$window.open('localhost:xxx/api/document', '_blank');