html嵌入腾讯视频的方法

1、首先我们从腾讯视频网站上找到一个视频网页的连接，格式是这样的

https://v.qq.com/x/page/b0136et5ztz.html

上面我标红色的是视频的vid

2、我们把vid放到接口地址上变成

http://vv.video.qq.com/getinfo?vids=b0136et5ztz&platform=101001&charge=0&otype=json

3、直接访问返回的是

QZOutputJson={"dltype":1,"exem":0,"fl":{"cnt":2,"fi":[{"id":100701,"name":"msd","lmt":0,"sb":1,"cname":"流畅;(180P)","br":29,"drm":0,"video":1,"fs":35776912,"sl":1},{"id":2,"name":"mp4","lmt":0,"sb":1,"cname":"高清;(480P)","br":34,"drm":0,"video":1,"fs":74129447,"sl":0}]},"hs":0,"ip":"119.137.195.73","ls":0,"preview":1186,"s":"o","sfl":{"cnt":0},"tm":1503504934,"vl":{"cnt":1,"vi":[{"br":29,"ch":0,"cl":{"fc":0,"keyid":"b0136et5ztz.100701"},"ct":21600,"drm":0,"dsb":0,"fmd5":"87d7d2ef15f55a456bcdb359dd580795","fn":"b0136et5ztz.m701.mp4","fs":35776912,"fst":5,"fvkey":"EBB1F5C7B5100A3DA80802119E3FF9D0AAE3DA6670594D507B02AD489CF21D2868B0803B76F7434CE51B5C70D75554D68ED24A49EE3DE4791E0BA58444A77756FA7CBC6FB1B3E579F44F87AFB1CB79E8522A48576A4949037A5EDC1C842A9EF7536E090EBD018BB2","head":0,"hevc":0,"iflag":0,"level":0,"lnk":"b0136et5ztz","logo":1,"mst":8,"pl":null,"share":1,"sp":0,"st":2,"tail":0,"td":"1186.92","ti":"解密潮汕多神信仰","type":3,"ul":{"ui":[{"url":"http://113.105.167.156/vhot2.qqvideo.tc.qq.com/AuRJoSSIabzpOb1RsXSviFl-nYwRDSZoFU5OpwBhfrAk/","vt":200,"dtc":0,"dt":2},{"url":"http://113.105.167.155/vhot2.qqvideo.tc.qq.com/AuRJoSSIabzpOb1RsXSviFl-nYwRDSZoFU5OpwBhfrAk/","vt":200,"dtc":0,"dt":2},{"url":"http://113.105.167.154/vhot2.qqvideo.tc.qq.com/AuRJoSSIabzpOb1RsXSviFl-nYwRDSZoFU5OpwBhfrAk/","vt":200,"dtc":0,"dt":2},{"url":"http://video.dispatch.tc.qq.com/62098754/","vt":0,"dtc":0,"dt":2}]},"vh":272,"vid":"b0136et5ztz","videotype":27,"vr":0,"vst":2,"vw":480,"wh":1.7647059,"wl":{"wi":[]}}]}};

4、我们把前面的QZOutputJson=跟最后的 ; 过滤掉，得到一个json字符串了。解析它变成json对象，然后把标红的三个部分组合一下，顺序是

url + fn + '?vkey=' + fvkey

例如上面这串，组合下来就是

http://113.105.167.156/vhot2.qqvideo.tc.qq.com/AuRJoSSIabzpOb1RsXSviFl-nYwRDSZoFU5OpwBhfrAk/b0136et5ztz.m701.mp4?vkey=EBB1F5C7B5100A3DA80802119E3FF9D0AAE3DA6670594D507B02AD489CF21D2868B0803B76F7434CE51B5C70D75554D68ED24A49EE3DE4791E0BA58444A77756FA7CBC6FB1B3E579F44F87AFB1CB79E8522A48576A4949037A5EDC1C842A9EF7536E090EBD018BB2

这个地址就可以直接放在小程序的video组件里面播放了。

注意：由于腾讯视频的地址vkey是定时变化的，所以肯定是不能写死在程序里面的。必须走后端照着上面写的方式抓取接口，过滤掉无用字符串，解析json，组合地址，通过接口返回给小程序video组件的src即可正常播放。

当然如果你的后端解析json比较麻烦的（例如古老的asp ^_^），可以把第2步最后的json去掉或者改成xml，直接解析xml也一样

第二种 嵌入

想要在网页中嵌入优酷、土豆、爱奇艺的视频很简单，但是现在将腾讯视频嵌入网页后却不能正常显示，而腾讯视频现在的资源也越来越多，想直接将腾讯视频嵌入到网页中怎么操作呢？其实只需要一段代码就可以了。

首先，提供一个腾讯视频嵌入网页代码。我们只需替换这段代码的一部分就可以了。

<p style="text-align: center"><iframe class="video_iframe" style="z-index:1;" src="http://v.qq.com/iframe/player.html?vid=t01662frswa&amp;width=500&amp;height=375&amp;auto=0" allowfullscreen="" frameborder="0" height="375" width="500"></iframe></p>

找到一段腾讯视频，比如地址：

http://v.qq.com/boke/page/d/0/i/d0163kxz8di.html

这是一段《工业机器人工作场景》的视频，将这个网址的蓝色部分，替换到上面给出的代码中的红色部分，就可以了。

最终效果为：

<p style="text-align: center"><iframe class="video_iframe" style="z-index:1;" src="http://v.qq.com/iframe/player.html?vid=d0163kxz8di&amp;width=500&amp;height=375&amp;auto=0" allowfullscreen="" frameborder="0" height="375" width="500"></iframe></p>

把vid参数从腾讯视频网页查找