21

When a user prints, my server generate a PDF, and I do this to show the print dialog for the PDF.

$('<iframe type="application/pdf"></iframe>').attr('src', url).load(function() {
    var iframe = this;
    setTimeout(function() { //Chrome PDF viewer shows "Loading..." forever otherwise
        iframe.contentWindow.print();
        $(iframe).remove(); //gc
    }, 50);
}).appendTo('body');

But now I am hosting the PDFs on S3. I get 

Uncaught SecurityError: Blocked a frame with origin "https://localhost" from
accessing a frame with origin "https://my-bucket.s3.amazonaws.com".
Protocols, domains, and ports must match.

I presume I need to add CORS headers.

I have

Access-Control-Allow-Methods: GET, HEAD
Access-Control-Allow-Origin: *

What am I missing?

Sebastian Zartner
  • 16,477
  • 8
  • 74
  • 116
Paul Draper
  • 64,883
  • 37
  • 172
  • 246
  • Did you resolve this? – Leandro Nov 19 '14 at 17:35
  • Did you resolve this? If so, can you post your answer? – Jeeva J Jun 28 '16 at 05:43
  • 1
    Possible duplicate of [SecurityError: Blocked a frame with origin from accessing a cross-origin frame](http://stackoverflow.com/questions/25098021/securityerror-blocked-a-frame-with-origin-from-accessing-a-cross-origin-frame) – HDave Aug 04 '16 at 15:10

1 Answers1

30

Paul - CORS does not apply when attempting to programmatically access content from a cross-origin iframe. If you want to access content from an iframe on a different domain, you will need to make use of the Web Messaging API (window.postMessage & the onmessage event) to communicate between your page and the iframe.

Ray Nicholus
  • 18,424
  • 13
  • 56
  • 80
  • 1
    That would be okay...except it seems my problem had no solution. In the iframe I have a *PDF*. And I want to print it. I can't exactly use `window.postMessage` in a PDF. – Paul Draper Mar 14 '14 at 20:58
  • 1
    @PaulDraper Just attach the PDF to an `` in the iframe, and include your message passing code in the iframe itself. – Ray Nicholus Mar 14 '14 at 21:08
  • 1
    @Ray, could you explain it with code? I'm a little lost here. Thanks! – Leandro Nov 19 '14 at 18:36
  • 14
    I wonder why CORS don't apply to cross-origin iframes. If the contents of an iframe explicitly allow access from another origin, why are iframes excluded from this? – Sebastian Zartner Sep 29 '16 at 11:16
  • 1
    [`window.postMessage` documentation on MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage) – amirouche Sep 21 '17 at 07:35
  • 1
    @SebastianZartner Because iframe "lives" — the user can interact with it, add some information, for example – Iv Ov Dec 04 '18 at 11:10
  • 3
    Interactions by the user with the content of the iframe are not the issue. By setting the CORS header, the page within the iframe provides full access to the page including the iframe. And I guess, that can cause security issues, because the accessing page could be corrupted and so manipulate the contents of the iframe's page. And that's why `window.postMessage()` exists, providing restricted interaction between both. But maybe that's what you meant. :-) – Sebastian Zartner Dec 04 '18 at 21:06
  • I think why cors is not supported in iframe is because iframe is a new window context, by allowing full control on that window, you are also giving access to any future website, which gets loaded inside iframe with location.href, and that website might not want to give access. – Shishir Arora May 15 '20 at 07:24