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

本文介绍了如何在H5中接入腾讯视频和YouTube视频。对于腾讯视频,通过iframe插入player.html并获取vid来播放;对于YouTube,不仅讲解了iframe简单嵌入,还涉及使用YouTube API进行更复杂操作,包括解决Chrome自动播放限制和视频状态控制。
摘要由CSDN通过智能技术生成

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的页面,例如:

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值