HTML嵌入PDF,从缓冲区设置内容

时间:2017-07-10 12:27:36

标签: javascript html pdf embed

我有一个html嵌入标签,想在里面显示一个pdf。这适用于来自文件的src。而是从文件中我想从内存中加载内容。所以我从缓冲区中的rest api返回pdf数据,并希望将其提供给embed标签。这可能吗? 这是一些示例代码

<div id ="pdfView">
    <embed class="form-control" src="some/path/file.pdf" id="pdf"/>
</div>

1 个答案:

答案 0 :(得分:0)

一种笨重的方法是在服务器上下载临时文件,然后更新src中使用的文件名。我没有测试,但它似乎应该工作。

另一种方法是使用数据标签。您需要对PDF内容进行Base64编码,然后使用the data URL scheme生成src标记。

示例:

<embed class="form-control" src="data:application/pdf;base64,JVBERi0xLjEKJcKlwrHDqwoKMSAwIG9iagogIDw8IC9UeXBlIC9DYXRhbG9nCiAgICAgL1BhZ2VzIDIgMCBSCiAgPj4KZW5kb2JqCgoyIDAgb2JqCiAgPDwgL1R5cGUgL1BhZ2VzCiAgICAgL0tpZHMgWzMgMCBSXQogICAgIC9Db3VudCAxCiAgICAgL01lZGlhQm94IFswIDAgMzAwIDE0NF0KICA+PgplbmRvYmoKCjMgMCBvYmoKICA8PCAgL1R5cGUgL1BhZ2UKICAgICAgL1BhcmVudCAyIDAgUgogICAgICAvUmVzb3VyY2VzCiAgICAgICA8PCAvRm9udAogICAgICAgICAgIDw8IC9GMQogICAgICAgICAgICAgICA8PCAvVHlwZSAvRm9udAogICAgICAgICAgICAgICAgICAvU3VidHlwZSAvVHlwZTEKICAgICAgICAgICAgICAgICAgL0Jhc2VGb250IC9UaW1lcy1Sb21hbgogICAgICAgICAgICAgICA+PgogICAgICAgICAgID4+CiAgICAgICA+PgogICAgICAvQ29udGVudHMgNCAwIFIKICA+PgplbmRvYmoKCjQgMCBvYmoKICA8PCAvTGVuZ3RoIDU1ID4+CnN0cmVhbQogIEJUCiAgICAvRjEgMTggVGYKICAgIDAgMCBUZAogICAgKEhlbGxvIFdvcmxkKSBUagogIEVUCmVuZHN0cmVhbQplbmRvYmoKCnhyZWYKMCA1CjAwMDAwMDAwMDAgNjU1MzUgZiAKMDAwMDAwMDAxOCAwMDAwMCBuIAowMDAwMDAwMDc3IDAwMDAwIG4gCjAwMDAwMDAxNzggMDAwMDAgbiAKMDAwMDAwMDQ1NyAwMDAwMCBuIAp0cmFpbGVyCiAgPDwgIC9Sb290IDEgMCBSCiAgICAgIC9TaXplIDUKICA+PgpzdGFydHhyZWYKNTY1CiUlRU9GCg==" id="pdf"/>

以上是this minimal PDF example的Base64编码数据。但是你不能给它这样的文件名,并且可能会看到一些奇怪的东西。

如果您需要有关Base64编码的指南,该指南可能超出范围,但此处有大量解决方案,例如this one