gradio-app / gradio

Build and share delightful machine learning apps, all in Python. 🌟 Star to support our work!
http://www.gradio.app
Apache License 2.0
33.41k stars 2.53k forks source link

a video component for handling YouTube videos? #2894

Closed davidbernat closed 1 year ago

davidbernat commented 1 year ago

The gr.Video() component works using local filenames or urls. But what is the expected use case for embedded video platforms like Youtube? YouTube is protective of its video access urls, as far as I understand this. What has the community been doing?

For example, the youtube_dl package does provide urls to the direct video codec files, and using those urls does successfully render the video file from the Chrome URL bar. These do not work (as successfully) in Gradio components.

url = "https://www.youtube.com/watch?v=akHOzLoAMYk"
import youtube_dl
with youtube_dl.YoutubeDL() as ydl:
    info = ydl.extract_info(url, download=False)

import gradio as gr
with gr.Blocks() as gui:
    gr.Video(value=info['formats'][0]['url'])

I searched the Gradio issues and found no instances of YouTube.

To clarify: the difficulty of using the video-file url of youtube_dl is that YouTube throttles its download speeds. (Here you can see a 2MB video file took 30 seconds.) Appropriate solution is to create an HTML frame, or some equivalent. But that does not answer the question of accessing the data.

Screenshot 2022-12-27 at 4 16 40 PM
abidlabs commented 1 year ago

I don't think we'll create a native component for YouTube videos (although users might be interested in creating custom components, when do that down the line). The best solution I would say is to embed the YT video, which works pretty well for me:

image

The code here is:

import gradio as gr

embed_html = '<iframe width="560" height="315" src="https://www.youtube.com/embed/EngW7tLk6R8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>'

with gr.Blocks() as demo:
    gr.HTML(embed_html)

demo.launch()
davidbernat commented 1 year ago

🙏 @abidlabs

  1. There is no implicit way to access the audio or video from within the gr.HTML element than the direct urls from e.g. youtube_dl, is that correct? That does not seem quite accurate, but I do not know video platforms well enough yet.
  2. At the current time, user created Components must be added to the official Gradio repository to be used at all, and this is still not open access. Is this still true, and do you have a mailing list to follow for technical updates?
  3. My life is better knowing that video exists. Thank you.
abidlabs commented 1 year ago

@davidbernat

  1. Yes, that is correct
  2. Correct, but we will provide support for custom components that do not need to be added to the Gradio repo in next several months. Probably best the follow the Twitter account or join our Discord for now
  3. :)

Will go ahead and close since that seems to answer the question, but feel free to reopen if not!

dwipper commented 11 months ago

On first try above embed approach didn't work by copying the URL of the video from Youtube. But after Googling "Embed Youtube Video", there was a mention to right-click on the video and get the embed code from there. Using that code, it worked.