代码之家 › 专栏 › 技术社区 › Adam Starrh

iframe中的PDF-适用于Firefox,但不适用于OSX上的Chrome

google-chrome macos javascript

Adam Starrh · 技术社区 · 8 年前

$(document).on('click', '#uploadSubmit', function(e){
    var myForm = document.getElementById('fileUploadForm');
    var data = new FormData(myForm);
    $.ajax({
        type:'POST',
        url:'/shipments/upload_docs/',
        processData: false,
        contentType: false,
        cache: false,
        data: data,
        success: function(result){
            $('.docs_action_tray').slideUp();
            var iframe = $('<iframe style="width: 40em; height: 30em;">');
            iframe.attr('src', result.url);
            $('#actionWindow').append(iframe);
        }
  });
});

所需的行为是返回的url后面的.pdf显示在 <iframe> . 它在Firefox中运行良好,但Chrome只是给了我一个 OPEN

编辑: 我已经测试过了 <object> 和 <embed> 同样的行为也会发生。我得到了一个打开文档的链接,而不是文档本身的预览。我想知道是否有一个默认的安全功能是压倒我的努力?

OSX 10.12.6版本 Chrome 69.0.3491.100(官方版本)(64位)

2 回复 | 直到 7 年前

Adrian Pop 7 年前

embed object 标签,如下所示:

<html>
<body>
    <embed src="https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf" width="500" height="375">
</body>
</html>

<html>
    <body>
       <object width="400" height="500" type="application/pdf" data="https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf">
            <p>Insert your error message here, if the PDF cannot be displayed.</p>
        </object>
    </body>
</html>

PDF.JS 图书馆。它是一个纯HTML/Js的PDF文档呈现程序,没有任何第三方插件。

在线演示: http://mozilla.github.com/pdf.js/web/viewer.html

github: https://github.com/mozilla/pdf.js

干杯!

编辑: 您可以尝试通过将pdf文件的页面转换为图像并显示它们来模拟这种情况。这不像是真正的经历,但也许有用。以下是一些可能对您有所帮助的链接: