使用从代码创建的数据打印 iframe 不起作用

Question

我有一些示例代码位于 pdfkit 的分支上：

https://github.com/EricG-Personal/pdf_printing/tree/feature/from_pdfkit

我使用 pdfkit 创建简单 PDF 的代码是：

var doc = new PDFDocument( { size: 'legal' } );

this.stream = doc.pipe( blobStream() );

doc.fontSize( 9 );
doc.font( 'Times-Roman' );
doc.text( "hello, world! I'm really here" );
doc.rect( 10, 10, 100, 100 ).stroke();
doc.end();

this.stream.on( 'finish', function() 
{
    console.log( "Stream Finished" );

    this.setState( { pdfData: this.stream.toBlobURL( 'application/pdf' ) } );
}.bind( this ) );

对于 jsPDF - https://github.com/EricG-Personal/pdf_printing/tree/feature/from_jspdf

var doc = new jsPDF({unit: 'pt', format: 'legal'});
var someText = "hello, world!";
var topCoordinate = 72;
var leftCoordinate = 72;
var padding = 8;

doc.setFont( "helvetica" );
doc.setFontSize( 24 );

var lineHeight      = doc.getLineHeight();
var textWidth       = doc.getTextWidth( someText );
var rectHeight      = ( lineHeight + ( padding * 2 ) );
var halfRectHeight  = rectHeight / 2;
var halfLineHeight  = lineHeight / 2;
var textYCoordinate = topCoordinate + halfRectHeight + halfLineHeight;

console.log( "Height: " + lineHeight );
console.log( "Width: " + textWidth );

doc.setDrawColor( 255, 0, 0 );
doc.rect( leftCoordinate, topCoordinate, textWidth, rectHeight );
doc.text( someText, leftCoordinate + padding, textYCoordinate );

doc.setDrawColor( 0, 0, 0 );
doc.rect( leftCoordinate, textYCoordinate - lineHeight, textWidth, lineHeight );

var blob   = doc.output( 'bloburl' );
var mythis = this;

setTimeout( function() 
{ 
    console.log( "Setting State" );

    mythis.setState({pdfData: blob});
}, 5000);

在这两种情况下，PDF 数据都在 iframe 中正确呈现，我最终调用：

window.frames["pdf_doc"].focus();
window.frames["pdf_doc"].print();

当 iframe 的 onLoad 函数触发时。

但是，实际要打印的页面是空白的。

Answer 1

它适用于 Safari，但不适用于 Firefox。我认为您为数组使用了错误的密钥：

window.frames[0].focus();
window.frames[0].print();

为我工作。

console.log(window.frames);

查看文档：https://developer.mozilla.org/de/docs/Web/API/Window/frames