javascript - 在 HTML 中嵌入 PDF 字节数据

标签 javascript pdf servlets bytearray

这应该有效,但似乎我遗漏了什么。

我在本地驱动器上有一个 pdf 文件。显然 Chrome 和其他浏览器无法获取该本地 URL,因为它是沙盒化的,所以我有一个 servlet 从本地驱动器中提取数据并通过 ajax 调用将其发送回 Web 客户端。我没有收到任何错误,似乎正在加载 pdf 查看器,但文件本身不会显示。我提前编码了,但还是不行。我将在下面展示我的众多方法,但我不会包括 servlet 代码,因为它似乎有效。

尝试 1:

function embedFile(){
    $.get("FileGetter", function(pdfText){

        var base64EncodedPDF = b64EncodeUnicode(pdfText);
        $("#embedHolder").append("<object id='embedder' width='80%' height='600px'><embed width=100% height=100%"
                                     + ' type="application/pdf"'
                                     + ' src="data:application/pdf;base64,'
                                     + base64EncodedPDF
                                     + "></embed></object>");

            });
        }

 function b64EncodeUnicode(str) {
     return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
                return String.fromCharCode('0x' + p1);
            }));
        }

尝试 2:

function embedFile(){
    $.get("FileGetter", function(pdfText){

        var base64EncodedPDF = b64EncodeUnicode(pdfText);
        var obj = $('<object id="repObjID" type="application/pdf" width="100%" height="600" border="2"></object>'); 
        obj.attr('data',base64EncodedPDF); 
        var embed = $('<embed type="application/pdf"></embed>'); 
        embed.attr('src',base64EncodedPDF); 
        $('#repObjID').append(embed); 
        $("#docHolder").html(obj);
    }

function b64EncodeUnicode(str) {
    return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g,               function(match, p1) {
                return String.fromCharCode('0x' + p1);
            }));
}    

最佳答案

1.使用 ajax 下载二进制数据到 arraybuffer

var xhr = new XMLHttpRequest;
xhr.open('get', '/path/to/pdf', true);
xhr.responseType = 'arraybuffer';
xhr.send();

2。创建 Blob 和对象 URL

var blob = new Blob([xhr.response], {type: 'application/pdf'});
var url = URL.createObjectURL(blob);

3。在 iframe 中加载 URL

iframe.src = url;

演示:https://webblocks.nl/tests/ajax-pdf.html

关于javascript - 在 HTML 中嵌入 PDF 字节数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38705385/

相关文章:

java - 严重: Context [/AnilProject] startup failed due to previous errors whil deploying war on tomcat

java - Spring MVC - 获取 HttpServletResponse 主体

java - 从应用程序链接(其他应用程序)重定向到 GET 自定义页面

javascript - 如何防止 native react 中的 onPress 事件

jquery - 处理javascript中的特殊字符

ios - 应用程序使用核心数据 - 如何实现 "print report"功能?

iphone - QLPreviewController:临时文件在哪里?

twitter-bootstrap - 使用 rotativa PDF Bootstrap 最小规模

javascript - 在导航栏中创建 Logo 作为主页按钮

javascript - 初学者 : I integrated a blog into my Javascript/React website, 但如何添加样式?