'youtube embeded video error NO ACCESS-CONTROL-ALLOW-ORIGIN
As you can see here https://mohamed-hassan.com/samples/project24/ , if you open the console you will see this error
(ZYLR4KocS2Q?enablejsapi=1&autoplay=1&mute=1&controls=0&showinfo=0&modestbranding=1&rel=0:1 Failed to load https://googleads.g.doubleclick.net/pagead/id: Redirect from 'https://googleads.g.doubleclick.net/pagead/id' to 'data:text;charset=utf-8,' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://www.youtube.com' is therefore not allowed access.)
I just embedded video from youtube using iframe tag and I added at the top of the index file header('Access-Control-Allow-Origin: *'); but still get this error.
Here is a screenshot
Solution 1:[1]
You forgot to add &origin=https://yourdomain.com to your iframe src, this value allows YouTube to add the proper headers to its response.
Solution 2:[2]
Error fix with this code:
<iframe class="lazy" allowfullscreen="1" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" src="https://www.youtube.com/embed/youtube_video_id?origin=https://yourdomain.com&showinfo=0&video-id=youtube_video_id&enablejsapi=1&widgetid=1&color=white&modestbranding=1&rel=0" data-title="video_title" title="video_title" frameborder="0"></iframe>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Romain Stievenard |
| Solution 2 | Pedro Marques |