javascript - jQuery 打印 iframe pdf 适用于本地主机,但不适用于服务器

标签 javascript jquery iframe

下面的代码在我的本地环境中完美运行..但是,在线相同的代码不起作用。我没有收到任何错误,iFrame 只是没有按预期弹出。

src 属性始终按预期在 iframe 中更改...

if($('#iFramePdf').length > 0)
    $('#iFramePdf').attr('src', json.pdf);
else
    $('body').append('<iframe class="hidden" id="iFramePdf" src="' + json.pdf + '"></iframe>');

// enough time for the src being changed
setTimeout(function()
{
    $('#iFramePdf').get(0).focus();
    $('#iFramePdf').get(0).contentWindow.print();
}, 1000);

可能出了什么问题?

编辑 1:看来问题可能是由于 content-type header 造成的? json.pdf 具有绝对网址,如下所示:

http://mywebsite.com/public/files/somefile.pdf 

并且它不会打开 chrome 预览对话框。但是,如果我删除 http://mywebsite.com 并仅发送 public/files/somefile.pdf - 就像相对路径一样,chrome 预览对话框会打开,但会显示我的404页面。

检索 PDF 的函数 ajax_get 具有以下响应 header :

Cache-Control:no-cache, no-store, must-revalidate
Connection:keep-alive
Content-Encoding:gzip
Content-Length:166
Content-Type:text/html; charset=UTF-8
Date:Tue, 26 Jan 2016 09:24:42 GMT
Expires:0
Pragma:no-cache
Server:nginx
Vary:User-Agent,Accept-Encoding
X-Powered-By:PHP/5.6.17

并检索以下 json: {"status":1,"msg":"添加成功","pdf":"http:\/\/mywebsite.com\/public\/files\/somefile.pdf"}

收到 json 并将 pdf 的路径发送到 Chrome 控制台的网络选项卡中的 iFrame 后,pdf 将作为响应 header 检索:

Accept-Ranges:bytes
Cache-Control:no-cache, no-store, must-revalidate
Connection:keep-alive
Content-Length:52611
Content-Type:application/pdf
Date:Tue, 26 Jan 2016 09:24:42 GMT
Expires:0
Last-Modified:Tue, 26 Jan 2016 09:24:42 GMT
Pragma:no-cache
Server:nginx
Vary:User-Agent

编辑 2:我刚刚尝试从 PHP 页面检索 PDF,但没有成功,如下所示:

function display_pdf($url)
{
   header('Content-type: application/pdf');
   header('Content-Disposition: inline; filename="testing.pdf"');
   header('Content-Transfer-Encoding: binary');
   header('Accept-Ranges: bytes');
   echo file_get_contents(base_url() . $url);
}

在发送到 iFramePdf 之前使用 JavaScript:

json.pdf = json.pdf.replace('http://mywebsite.com/', '');
json.pdf = base_url + 'backend/files/display_pdf/' + json.pdf;

最终网址类似于:http://mywebsite/backend/files/display_pdf/public/files/somefile.pdf

如果我在浏览器中输入该链接,它会起作用。但在 iframe 中,它仍然无法从 chrome 打开打印预览。

编辑 3:我又运行了一些测试,但问题在 iframe 上仍然存在,因为它以其他方式工作。例如,下面的代码打开一个新选项卡并自动打开 chrome 的打印预览对话框,没有任何问题。

var win=window.open('about:blank');
win.document.write('<html><head></head><body>'); 
win.document.write('<iframe frameBorder="0" align="center" src="' + json.pdf + '" onload="test()" style="width: 100%; height: 100%"></iframe>'); 
win.document.write('<scr'+'ipt>function test(){window.focus();window.contentWindow.print()}</sc'+'ript></body></html>'); 
win.document.close(); 
if (window.focus) {win.focus()}

但我不想打开新标签。所以我尝试在我所在的选项卡中打开一个选项卡,如下所示:

var printWindow = window.open(json.pathToPdf, "printWindow", "scrollbars=yes");
printWindow.focus();
printWindow.print();

并且有效,它会在我所在的选项卡中打开一个小选项卡,但是它不会聚焦 chrome 打印预览对话框,如果我在全屏上工作,它会将其关闭。

编辑4:问题确实是因为PDF。如果我更改代码:

$('body').append('<iframe class="hidden" id="iFramePdf" src="' + json.pdf + '"></iframe>');

$('body').append('<iframe class="hidden" id="iFramePdf" src="http://mywebsite.com/public/images/someimage.png"></iframe>');

$('body').append('<iframe class="hidden" id="iFramePdf" src="http://mywebsite.com/somepage.php"></iframe>');

它可以正常工作,没有任何问题。

如果我将 PDF 直接设置到 src 中,打印预览对话框不会打开,但 PDF 会加载到 iframe 中。

$('body').append('<iframe class="hidden" id="iFramePdf" src="http://mywebsite.com/public/files/somepdf.pdf"></iframe>');

最佳答案

经过我的所有尝试,这看起来确实是一个没有人知道的错误。它可以在本地主机上运行,​​但不能在服务器上运行。唯一的问题是 PDF 文件,因为图像和页面工作正常。

我最终可能会根据生成的 PDF 文件创建图像,这不是一个好的解决方案,因为我可以拥有多个 PDF 页面。

无论如何,如果有人知道任何解决方案或希望我尝试任何事情,我会很乐意这样做。

关于javascript - jQuery 打印 iframe pdf 适用于本地主机,但不适用于服务器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34990535/

相关文章:

javascript - 可选的链接运算符在本地主机上工作但不在生产中

javascript - YouTube 视频高度比、拉伸(stretch)到窗口宽度以及在父容器外拉伸(stretch)

javascript - 使用 jQuery 从一个值获取两个值

javascript - 如何使用 jquery 突出显示与数字匹配的所有列

javascript - JS代码提取Youtube Livestream视频ID

javascript - z-index 在 IE 中不工作

google-apps-script - iFrame 中的应用程序脚本 HTMLService 应用程序

javascript - 不同鼠标悬停时发出多种声音

MVC 编辑器模板中的 JavaScript 无法正确呈现

javascript - 单击时清除 <p> 标记中的默认文本