Question

我正在尝试打印由jspdf生成并加载到iframe上的pdf，但是我收到了错误消息：

“DOMException：阻止具有原始”http://localhost:8084“的帧访问跨源帧。”

这是我的代码：

  <iframe id="pdf-prueba" name="pdf-box"></iframe>


function open(){
    var pdf = new jsPDF('p', 'mm', [55, 5]);
    var data = pdf.output('datauristring');
    $('#pdf-box').attr("src", data).load(function(){
        document.getElementById('pdf-box').contentWindow.print();
    });
}

Answer 1

DOMException：使用origin＆＃34; http://localhost:8084＆＃34;阻止了一个框架从访问跨源框架。＆＃34;

此消息有效，因为当您使用pdf加载iframe时，您使用datauristring而不是blob设置src属性。

一个简单的解决方案基于：

从pdf创建一个blob（即：pdf.output（＆＃39; blob＆＃39;）..）
将blob转换为URL（即：URL.createObjectURL（blobPDF））

使用您的方法违反了该策略，因为协议（http / data）不同：

一个是http://localhost:8084
iframe是：data：application / pdf

另一个错误是：

document.getElementById('pdf-box')

您必须使用id而不是名称，因此请将其更改为：

document.getElementById('pdf-prueba')

以下更改的代码适用于Chrome：

function open(){
  var pdf = new jsPDF('p', 'mm', [55, 5]);

  var blobPDF = pdf.output('blob');

  var blobUrl = URL.createObjectURL(blobPDF);

  $('#pdf-prueba').attr("src", blobUrl).load(function(e){
    document.getElementById('pdf-prueba').contentWindow.print();
  });
}

<iframe id="pdf-prueba" name="pdf-box"></iframe>

阻止具有原点“http：// localhost：8084”的帧访问跨源帧

1 个答案: