使用 http headers 预览 pdf

Question

我正在尝试使用 HTML 代码在浏览器中预览 pdf：

<div class="col-xs-12 clearfix">
    <object width="100%" height="600px" data="<%- model.pdf %>" type="application/pdf">
        <p>It appears you don't have Adobe Reader or PDF support in this web browser. <a href="<%- model.pdf %>">Click here to download the PDF</a>. Or <a href="http://get.adobe.com/reader/" target="_blank">click here to install Adobe Reader</a>.</p>
        <embed width="100%" height="600px" src="<%- model.pdf %>" type="application/pdf" />
    </object>
</div>

其中 model.pdf 是我生成的 url 以从那里请求它。

问题：

我在一个完整的 javascript/fe 项目中工作，该项目是 API 的使用者。作为客户，我需要一个令牌和其他一些东西来从我必须在每次调用的 headers 中设置的 API 请求数据。

所以我需要的是，以某种方式将这些 headers 设置在某处。

我的问题：

有可能吗？

提前致谢。

Answer 1

也许PDF.js对你有用。

The object structure of PDF.js loosely follows the structure of an actual PDF. At the top level there is a document object. From the document, more information and individual pages can be fetched. To get the document:
PDFJS.getDocument('helloworld.pdf')

对于 headers 试试这个：

var 
    obj = {};

obj.url = 'url_to_your_file.pdf';
obj.httpHeaders = {
    
    "X-Header": "VALUE"
};
  
PDFJS.getDocument(obj).then(function(pdf) {
  
    // your code
});

您阅读了更多有关 DocumentInitParameters here 的内容。

使用 http headers 预览 pdf

Preview pdf with http headers

html

javascript

pdf

api