Chrome扩展程序 - 保存PDF文件 [英] Chrome extension - saving PDF file

问题描述

我正在开发一个Chrome扩展程序，将文件保存到下载文件夹（这不是所有的操作，但这是我遇到的问题）。现在我专注于PDF文件。基本上，当在Chrome中打开PDF时，用户可以使用菜单 - 将文件另存为...进行手动保存，我只是试图使用扩展程序自动执行此功能，但我还没有找到一种好方法做到这一点。

假设我可以检测当前标签中是否有PDF文件（基于这个问题）。

到目前为止，我发现的最好的办法是开始下载：

  chrome.downloads。下载（{
 url：tabs [0] .url，saveAs：false，
 filename：my file，/ *这将是一些独特的自动生成的标识符* / 
 conflictAction： 
}）; 
  

这有效，但有两个缺点：$ b​​
$ b

• 必须重新下载该文件，如果文件很大，这会很痛苦。此外，该文件已被下载，所以我应该可以使用它。


• 由于某些原因，这不适用于本地打开的文件（file：// ... ）。它会抛出一个NETWORK_INVALID_REQUEST并且不会下载。
  
  
  

  是否有更好的方法来保存文件？$ b $注意，铬/铬浏览器似乎在文档中附加嵌入元素。 .body 显示 .pdf 文件

  
  
  1. <使用 window.location.href ， document.querySelectorAll（）检测 pdf 嵌入）[0] .type ;
     
     利用 XMLHttpRequest 现有的文档，它应该返回 pdf 文档为 blob 响应，来自 cache ;请参阅控制台 - > 网络 - > 标题 - > 状态码

  
  

  2. 允许打开文件： 协议在铬/铬浏览器中，尝试使用命令行标记 - 允许从文件访问;请参阅如何我让谷歌浏览器标志--allow-file-access-from-files是永久的？

  hr>
  
  

  在 .pdf document ，ieg; Ecma-262.pdf 试试 p>
  
  

    //检查文档是否为`pdf` 
   if（/pdf/i.test(window.location。 href.slice（-3））
   || document.querySelectorAll（embed）[0] .type ===application / pdf）{
   var xhr = new XMLHttpRequest（）; 
   //从`cache`加载`document` 
   xhr.open（GET，，true）; 
   xhr.responseType =blob; 
   xhr.onload = function（e）{
   if（this.status === 200）{
   // blob` response 
   console.log（this.response） ; 
   var file = window.URL.createObjectURL（this.response）; 
   var a = document.createElement（a）; 
   a.href = file; 
   a.download = this.response.name 
   || document.querySelectorAll（embed）[0] .src 
   .split（/）。pop（）; 
   document.body.appendChild（a）; 
   a.click（）; 
   //在`Save As`对话框后面移除`a`，
   //``window`重新获得`focus` 
   window.onfocus = function（）{
   Array.prototype。 forEach.call（document.querySelectorAll（a）
  ，function（el）{
   document.body.removeChild（el）
  }）
  } 
  } ; 
  }; 
   xhr.send（）; 
  }; 
    

  
  

  I'm developing a Chrome extension that will save files to the downloads folder (that's not all it's doing, but that's the part I have trouble with). Right now I'm focusing on PDF files. Basically, when a PDF is opened in Chrome, the user can manually can save it using Menu - Save File As..., I'm just trying to automate this functionality using the extension, but I haven't found a good way to do it.

  Let's say I can detect if the current tab has a PDF file in it (based on answers from this question).

  The best thing I have figured out so far is to initiate a download:

  chrome.downloads.download({
      url: tabs[0].url, saveAs: false,
      filename: "my file", /* This will be some unique autogenerated identifier */
      conflictAction: "overwrite"
  });
  

  This works but has 2 drawbacks:

  • The file has to be re-downloaded, which is a pain if it's large. Besides, the file has been downloaded already so I should be able to use it.
  • For some reason this doesn't work with files opened locally ("file://..."). It throws a NETWORK_INVALID_REQUEST and doesn't download.

  Is there a better way to save the file?

  解决方案

  Note, chromium / chrome browsers appear to append embed element to document.body to display .pdf files

  1. a) detecting pdf utilizing window.location.href , document.querySelectorAll("embed")[0].type;

     b) utilizing XMLHttpRequest to request existing document, which should return pdf document as blob response, from cache; see console -> Network -> Headers -> Status Code

  2. To allow opening file: protocol at chromium / chrome browsers, try utilizing command line flag --allow-access-from-files; see How do I make the Google Chrome flag "--allow-file-access-from-files" permanent?

  ---

  At .pdf document , i.e.g; Ecma-262.pdf try

  // check if `document` is `pdf`
  if (/pdf/i.test(window.location.href.slice(-3)) 
      || document.querySelectorAll("embed")[0].type === "application/pdf") {
      var xhr = new XMLHttpRequest();
      // load `document` from `cache`
      xhr.open("GET", "", true); 
      xhr.responseType = "blob";
      xhr.onload = function (e) {
          if (this.status === 200) {
              // `blob` response
              console.log(this.response);
              var file = window.URL.createObjectURL(this.response);
              var a = document.createElement("a");
              a.href = file;
              a.download = this.response.name 
                          || document.querySelectorAll("embed")[0].src
                             .split("/").pop();
              document.body.appendChild(a);
              a.click();
              // remove `a` following `Save As` dialog, 
              // `window` regains `focus`
              window.onfocus = function () {                     
                  Array.prototype.forEach.call(document.querySelectorAll("a")
                  , function (el) {
                      document.body.removeChild(el)
                  })
              }
          };
      };
      xhr.send();
  };
  

  这篇关于Chrome扩展程序 - 保存PDF文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！