How to use CORS to access an iframe
53,385
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.
Author by
Paul Draper
Brigham Young University, BS. Lucid Software, Principal Engineer. Rivet, CTO.
Updated on August 03, 2022Comments
-
Paul Draper almost 2 years
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?