how to play youtube videos in flutter

user_11325009 0
Viewed 1550

I'm trying to play YouTube Videos in my Flutter Web Application, but with the default VideoPlayer you need the YouTube src path (...googlevideos.com/...), which I couldn't get right.

I did some google research and I found the following packages:

But both of them won't play direct YouTube links, and the first one isn't supported for Flutter-Web.

Does anyone have experience with this topic or knows how to get the YouTube source links (for example with an API) ?

flutter-web flutter
2 Answers

EDIT1: YouTube seems to shuffle the source video file url every day, so using the source file url is not a viable solution. Another option is to add the video to your project locally and add an overlay "YouTube" button on top of the video and when the user taps it he is taken to the video on YouTube. Downside to using asset video though is the fact that you are unable to adjust the progress bar (at least in version 2.4.5).

You can use the official video_player package and get the source file path to YouTube video file by using VLC media player by following these steps:

  1. Find a video on YouTube and copy the URL from the address bar.
  2. In VLC, head to Media > Open Network Stream.
  3. Paste the YouTube link in the box and click Play.
  4. Under Tools, click Codec Information.
  5. In the box that says Location, right-click the block of text and click Select All. This is the url to your local video file.

These steps are almost a copy / paste found from here: How to obtain the direct link to a YouTube video file

You can also use the youtube_player_iframe package, but note that if you hover on top of the video when using that player, you are unable to scroll your content and there seems to be no workaround as discussed in here: Mouse scroll stuck while cursor is on top of youtube_player_iframe. That's the only reason why I decided to use the official video player package.

user_120990620
user_170158050
Related