H5的视频解决方案(3)——第三方视频接入(腾讯、youtube)

2023-10-24 10:04:01

    • 3. 腾讯视频接入
    • 4. YouTube视频接入
      • (1) 使用iframe嵌入
      • (2) 使用YouTbue API

3. 腾讯视频接入

通过iframe将视频插入。

地址为：https://v.qq.com/iframe/player.html?vid={视频id}。

如何获取id？

例如这样一个腾讯视频的播放页面：https://v.qq.com/x/page/i0314gnvro5.html

它的id就是i0314gnvro5，插入代码如下：

<iframe src="https://v.qq.com/iframe/player.html?vid=i0314gnvro5" allowfullscreen="" frameborder="0" class="video">iframe>

4. YouTube视频接入

(1) 使用iframe嵌入

应用场景为：只是想在页面上插入一个youtube的视频，不进行复杂的响应和回调。

官方嵌入及播放器参数文档：https://developers.google.com/youtube/player_parameters

Iframe的src为http://www.youtube.com/embed/VIDEO_ID。可以直接将播放器参数附加到网址末尾。

如何获得这个ID呢？打开youtube的页面，例如：https://www.youtube.com/watch?v=ziGD7vQOwl8，末尾的这串就是ID。