Html 视频标签中的 YouTube URL

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19836015/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-29 15:07:39  来源:igfitidea点击:

YouTube URL in Video Tag

csshtmlvideoyoutube

提问by Dinesh Kanivu

I am using Video tag, and i want to use any URL from you tube in it

我正在使用 Video 标签,我想在其中使用您管中的任何 URL

Check this http://jsfiddle.net/wCrNw/Its is not working, Please help me

检查这个http://jsfiddle.net/wCrNw/它不起作用,请帮助我

I have checked this.Show Youtube video source into HTML5 video tag?. This is not solving my question

我已经检查过了。将 Youtube 视频源显示为 HTML5 视频标签?. 这不能解决我的问题

    <video controls="controls" 
           class="video-stream" 
           x-webkit-airplay="allow" 
           data-youtube-id="N9oxmRT2YWw"  
src="http://www.youtube.com/watch?v=OmxT8a9RWbE"
           ></video>

回答by MrJustin

MediaElement YouTube API example

Wraps the YouTube API in an HTML5 Media API wrapper, so that it can be programmed against as if it was true HTML5 <video>.

MediaElement YouTube API 示例

将 YouTube API 包装在 HTML5 Media API 包装器中,以便可以针对它进行编程,就好像它是真正的 HTML5 一样<video>

<script src="jquery.js"></script>
<script src="mediaelement-and-player.min.js"></script>
<link rel="stylesheet" href="mediaelementplayer.css" />

<video width="640" height="360" id="player1" preload="none">
    <source type="video/youtube" src="http://www.youtube.com/watch?v=nOEw9iiopwI" />
</video>

<script>
    var player = new MediaElementPlayer('#player1');
</script>

回答by Rahul

Video tag supports only video formats (like mp4 etc). Youtube does not exposeits raw video files - it only exposes the unique id of the video. Since that id does not correspond to the actual file, video tag cannot be used.

视频标签仅支持视频格式(如 mp4 等)。Youtube不会公开其原始视频文件 - 它只公开视频的唯一 ID。由于该 id 与实际文件不对应,因此无法使用 video 标签。

If you do get hold of the actual source fileusing one of the youtube download sites or soft wares, you will be able to use the video tag. But even then, the url of the actual source will cease to work after a set time. So your video also will work only till then.

如果您确实使用 YouTube 下载站点或软件之一获得了实际的源文件,您将能够使用视频标签。但即便如此,实际来源的网址也会在设定的时间后停止工作。因此,您的视频也只能在此之前有效。

回答by BBQ.

The most straight forward answer to this question is: You can't.

对这个问题最直接的回答是:你不能。

Youtube doesn't output their video's in the right format, thus they can't be embedded in a
<video/>element.

Youtube 没有以正确的格式输出他们的视频,因此它们不能嵌入到
<video/>元素中。

There are a few solutions posted using javascript, but don't trust on those, they all need a fallback, and won't work cross-browser.

有一些使用 javascript 发布的解决方案,但不要相信这些,它们都需要回退,并且不能跨浏览器工作。

回答by aarti

According to a YouTube blog post from June 2010, the "video" tag "does not currently meet all the needs of a website like YouTube" http://apiblog.youtube.com/2010/06/flash-and-html5-tag.html

根据 2010 年 6 月的 YouTube 博客文章,“视频”标签“目前不能满足像 YouTube 这样的网站的所有需求” http://apiblog.youtube.com/2010/06/flash-and-html5-tag .html

回答by Adrian Roworth

This will give you the answer you need. The easiest way to do it is with the youTube-provided methods. How to Embed Youtube Videos into HTML5 <video> Tag?

这会给你你需要的答案。最简单的方法是使用 YouTube 提供的方法。如何将 Youtube 视频嵌入 HTML5 <video> 标签?

回答by Adrian Roworth

This would be easy to do :

这很容易做到:

<iframe width="420" height="345"
src="http://www.youtube.com/embed/XGSy3_Czz8k">
</iframe>

Is just an example.

只是一个例子。