美文网首页微信小程序开发微信小程序小程序
微信小程序如何播放腾讯视频?

微信小程序如何播放腾讯视频?

作者: popperYY | 来源:发表于2018-05-08 19:50 被阅读104次

    1.背景

    因为当时需要做视频播放,后台存放视频文件又不现实。所以,做了一个能解析腾讯视频地址的并播放视频的小程序。

    2.介绍

    小程序里的解析腾讯视频地址的代码是参考了一个开源项目you-get写的,把里面的腾讯视频下载的python代码写成了JS代码。

    3.腾讯视频ID从哪获取

    1.一般播放一个腾讯视频的时候播放地址为https://v.qq.com/x/page/w0647n5294g.html
    .html到最后一个/之间的字符串即为腾讯视频id。如https://v.qq.com/x/page/w0647n5294g.html的id为w0647n5294g

    4.获取腾讯视频真实播放地址

    分为以下两步

    • 1 获取视频信息
      把腾讯视频ID传入以下函数
    getVideoInfo: function (vid) {
        var that = this;
        var urlString = 'https://vv.video.qq.com/getinfo?otype=json&appver=3.2.19.333&platform=11&defnpayver=1&vid=' + vid;
        wx.request({
          url: urlString, 
          success: function (res) {
            var dataJson = res.data.replace(/QZOutputJson=/, '') + "qwe";
            var dataJson1 = dataJson.replace(/;qwe/, '');
            var data = JSON.parse(dataJson1);
            var fn_pre = data.vl.vi[0].lnk
            host = data['vl']['vi'][0]['ul']['ui'][0]['url']
            var streams = data['fl']['fi']
            var seg_cnt = data['vl']['vi'][0]['cl']['fc']
            if (parseInt(seg_cnt) == 0) {
              seg_cnt = 1
            }
            var best_quality = streams[streams.length - 1]['name']
            var part_format_id = streams[streams.length - 1]['id']
    
            for (var i = 1; i < (seg_cnt + 1); i++) {
              var filename = fn_pre + '.p' + (part_format_id % 10000) + '.' + i + '.mp4';
              console.log(filename);
              pageArr.push(i);
              that.requestVideoUrls(part_format_id, vid, filename, 'index' + i);
    
            }
    
          }
        })
      },
    
    • 2 根据视频信息解析视频真正的播放地址
    requestVideoUrls: function (part_format_id, vid, fileName, index) {
        var keyApi = "https://vv.video.qq.com/getkey?otype=json&platform=11&format=" + part_format_id + "&vid=" + vid + "&filename=" + fileName + "&appver=3.2.19.333"
        var that = this;
        wx.request({
          url: keyApi,
          success: function (res) {
            var dataJson = res.data.replace(/QZOutputJson=/, '') + "qwe";
            var dataJson1 = dataJson.replace(/;qwe/, '');
            var data = JSON.parse(dataJson1);
            if (data.key != undefined) {
              var vkey = data['key']
              var url = host + fileName + '?vkey=' + vkey;
              part_urls[index] = String(url)
              that.setData({
                videoUrl: part_urls.index1
              });
            }
          }
        })
      },
    
    

    该函数里面的part_urls.index1,即为腾讯视频的真实地址。把这个地址放到小程序的video组件的src中,即可播放腾讯上的视频。
    最后放上demo:weChatVideoPlay

    还有自己独立开发的小程序“街舞赛事资讯”


    gh_2a1c033af681_1280 (1).jpg

    相关文章

      网友评论

      • 老农民侃运维:好像不行了,我刚才试了一下,已经无法解析了。
        popperYY:@吖赵同学 把https://vv.video.qq.com加入到你微信公众平台->设置->服务器域名->request合法设置里面去。
        00bd88f9f2e8:@popperYY http://vv.video.qq.com 不在以下 request 合法域名列表中 这个咋弄
        popperYY:可以的,你可以多试几个视频,有些有版权,需要VIP会员的视频解析不了。
      • 神木惊蛰:很牛逼啊!给👍👍👍。那个地址解析逻辑你是通过什么方法知道的啊
        popperYY:谢谢夸奖,解析逻辑我也不知道,主要是看了开源项目you-get的源代码。照葫芦画瓢,把python写的解析逻辑换成JS的而已:stuck_out_tongue_winking_eye:
      • 沈泽佳:非常感谢,代码很有用demo也很好,特意注册了简书评论和点赞的。:relaxed:
        popperYY::relaxed: :relaxed: :relaxed: ,非常感谢你的鼓励和评论。能对你有帮助就好。
      • IT人故事会:老铁,经常看别人的分享.感谢别人的分享,感谢!关注了

      本文标题:微信小程序如何播放腾讯视频?

      本文链接:https://www.haomeiwen.com/subject/qlgwrftx.html