Handle refused to connect error when using iframe inside react app

user_10217681 0
Viewed 131

I am trying to replace Iframe with image or text when URL in it refused to connect but I could not handle this error I don't want to solve x-frame-options error I want to handle it to show image or message when iframe can't connect exm1 ==> this URL working

<iframe key={random} src="https://www.youtube.com/embed/b4i7j6U7Ul8" width="100%" height="100%" sandbox="allow-scripts allow-same-origin allow-presentation" loading='lazy'/>

exm2 ==> this not work

<iframe key={random} src="https://www.google.com" width="100%" height="100%" sandbox="allow-scripts allow-same-origin allow-presentation" loading='lazy'/>

I want to replace Iframe tag when Url refused to connect with image or text

react-hooks reactjs iframe
1 Answers
  1. const youtybe = "https://www.youtube.com/embed/b4i7j6U7Ul8"
  2. const image = "https://www.google.com/imgae"

 <iframe key={random} src={error ? image : youtube} width="100%"
       height="100%" sandbox="allow-scripts allow-same-origin
       allow-presentation" loading='lazy'/>

src={error ? image : youtube}

in src : if an error image will be appear if not youtube will be appear

user_163692090
Related