I'm trying to access the YouTube Player API from my web page to programmatically control an embedded YouTube video in an iframe. When I try to execute this code player = iframe.contentWindow.player;
, I'm encountering a CORS (Cross-Origin Resource Sharing) error that prevents the API requests from being executed. Here are the details:
- Origin: https://example.com
- iframe.src : https://www.youtube.com/embed/aTkgF33C9hA?controls=0&modestbranding=1&rel=0&showinfo=0&loop=0&fs=0&hl=en&enablejsapi=1&origin=https%3A%2F%2Fexample.com&widgetid=1
- Error message: Uncaught DOMException: Blocked a frame with origin "https://example.com" from accessing a cross-origin frame.
I have already set the origin parameter in the API request URL to match my website's origin (https://example.com). However, it seems that the YouTube player API still enforces the same-origin policy and blocks the requests.Is there any way to overcome this CORS error and access the YouTube Player API from a different origin? Am I missing something in the configuration or is there an alternative solution I should consider?
Any help or guidance would be greatly appreciated. Thank you!