appleple / react-modal-video

Accessible React Modal Video Component
https://appleple.github.io/react-modal-video/
MIT License
177 stars 86 forks source link

Youtube autoplay is no longer working #16

Closed funwithtriangles closed 4 years ago

funwithtriangles commented 6 years ago

Using ?autoplay=1 no longer seems to work with YouTube videos.

I managed to get it working by removing any config from the videoId prop and hacking a version of this library so that the iFrame element has this attribute:

 allow="autoplay; encrypted-media"

I think the way to fix this would be to have a new prop such as youtubeAutoplay so that the above attribute is added to the iframe.

Related issue on Stack Overflow: https://stackoverflow.com/questions/48086769/youtube-iframe-api-allow-autoplay-chrome-65

pablo67340 commented 5 years ago

So by the looks of things... this library is abandoned.

gusblacknails commented 4 years ago

I've figured out why it's not working anymore. There's no need to hack the library just set mute:1. It is a problem with Youtube's API, you can't autoplay without muting the sound at the same time. So setting the ModalVideo props like that will do the trick:

<ModalVideo
            channel="youtube"
            youtube={{
              autoplay: 1,
              mute: 1
            }}
          ...
          />
kevinorin commented 1 year ago

youtube={{ autoplay: 1, mute: 1 }}

That works, but this is really silly. The video is already in a modal window that the user needs to click to open. Autoplaying a video on mute completely bombs the user experience.