contentWindow of the print Iframe is not loaded.

See original GitHub issue

``First of all, Thanks for your amazing library. I’m currently using react-to-print happily in my project.

But I’m having a problem which is that contentWindow of the print Iframe is not loaded when I try to put some images in my document. Without images, react-to-print works very well.

Below is my screenshot of error message.

image

I’m using Electron and here is part of my source code with image tags.

  const [objectiveUrl, setObjectiveUrl] = useState<string | undefined>(undefined)

  useEffect(() => {
    const reader = new FileReader()

    reader.onload = () => {
      setObjectiveUrl(reader.result as string)
    }

    if (image instanceof Promise) {
      image.then((_file) => {
        reader.readAsDataURL(_file)
      })
    } else if (image instanceof File || image instanceof Blob) {
      reader.readAsDataURL(image)
    }
  }, [])

  return (
    <Column spacing={10}>
      <img className="objective_pdf_image" src={objectiveUrl} alt="Objective" />
      <div className="objective_pdf_image_title">{title}</div>
    </Column>
  )

1 or 2 images work well, but if there comes more than 2 or 3 images, webContent doesn’t show up.

Issue Analytics

  • State:open
  • Created a year ago
  • Comments:9

github_iconTop GitHub Comments

1reaction
pmw1407commented, Jul 29, 2022

Good News!

Since I started to pass AWS S3 download url instead of base64 encoded string to <image />, it works!

It definitely seems that passing base64 encoded string was a problem.

Though the download url from AWS S3 has 5 minutes duration, it works as well after 5 minutes, can’t find out why it’s working 😅

But I still have a problem when I put local images, I’m currently passing URL.createObjectURL(_image) I think this is the problem, I should find out how to pass local image path to <image />.

1reaction
pmw1407commented, Jul 29, 2022

Thanks for your support.

I think because I’m passing base64 encoded string to src of <image />, images are not cached so it takes some time.

I should try to find out something better too, let me know when you find something good.

Thanks!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Printing failed because the contentWindow of the print iframe ...
They receive this error, This happens in both Android (Chrome) and iOS (Safari). console error: Printing failed because the `contentWindow` of the print...
Read more >
Javascript Print iframe contents only - jquery - Stack Overflow
So, in reference to that iframe, we first obtain the iframe by using it's id, and then it's contentWindow returns a window(DOM) object....
Read more >
Inside IFRAME PRINT() is not working - Essential Objects
print() is called on an iframe: 1. Use window.open to open a top level frame (For example, in TabbedBrowser sample application, this would...
Read more >
Printing an iframe with pdf using javascript is not working in ...
I have a problem with printing and Iframe with PDF in IE 8 and above. Following is my javascript: var urlValue="";//Path of the...
Read more >
Printing IFrame from javascript is not working in firefox ...
Try this link http://www.sitepoint.com/load-pdf-iframe-call-print/[^]
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found