小程序播放腾讯视频

最近写了小程序播放腾讯视频的逻辑,不是我自己写的,我觉得很不错,拿过来直接用了,我整理了一下小程序代码,和大家分享一下.

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

填写视频id可以直接传id,或者传入网址,正则匹配到视频id,这里根据业务逻辑自行调整代码

 

下面是页面调用逻辑(js部分)

var part_urls = {};
var videoPage;
var pageArr = new Array();
import qqVideo from "../../utils/qqVideo.js";

Page({

  onLoad: function (options) {
    //这里是直接接受视频id(vid)
    //vid = w0647n5294g,示例地址:https://v.qq.com/x/page/w0647n5294g.html
    if (options.vid != undefined) {
      this.setData({
        file_id: options.vid
      });
    } else {
      wx.showToast({
        title: '未传入视频id',
      })
    }

    videoPage = 1;
    pageArr = new Array();
    part_urls = {};
    var that  = this;
    const vid = options.vid;
    qqVideo.getVideoes(vid).then(function (response) {
      for(var i=1;i < response.length+1;i++){
        var indexStr = 'index'+(i)
        pageArr.push(i);
        part_urls[indexStr] = response[i-1];
      }
      that.setData({
        videUrl: response[0],
      });
    });
  },

  // 因为视频超过10分钟之后，会分段，所以当视频为多段的时候，
  // 自动播放下一段视频
  playEnd: function () {
    if (videoPage >= parseInt(pageArr.length)) {
      // part_urls = {};
      videoPage = 1;
      this.videoContext.exitFullScreen
    } else {
      videoPage++;
      var index = 'index' + videoPage;
      this.setData({
        videUrl: ''
      });
      this.setData({
        videUrl: part_urls[index]
      });
    }
  },

  onReady: function () {
    // 页面渲染完成
    this.videoContext = wx.createVideoContext('myVideo')
  },


})

下面是页面wxml

<view class="pageView">
<video id="myVideo" objectFit="cover" autoplay="true" bindended="playEnd" src="{{videUrl}}">
	</video>
</view>

下面是wxss

.pageView{
  display: flex;
  background-color: #000;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 1154rpx;
}
video{
	width: 100%;
	height: 422rpx;
}

下面是封装的解析真正视频地址的qqVideo.js函数

var count = 0;

// 用来装视频列表
var videoSrcArr = new Array();

const qqVideo = {
getVideoes (vid) {
  count = 0;
  videoSrcArr = new Array();
  var that = this;
  var platforms = [4100201, 11]
  for (const platform in platforms) {
    var videoUrl = 'https://vv.video.qq.com/getinfo?otype=json&appver=3.2.19.333&platform='+platform+'&defnpayver=1&vid=' + vid;
    var host;
    return new Promise(function (resolve) {
    wx.request({
      url: videoUrl,
      success: function (res) {
        var dataJson = res.data.replace(/QZOutputJson=/, '') + "qwe";
        var dataJson1 = dataJson.replace(/;qwe/, '');
        var data = JSON.parse(dataJson1);
        if (data.msg == 'cannot play outside') {
          wx.showToast({
            title: 'cannot play outside',
            icon: 'none',
            duration: 2000
          })
          return nil;
        }
        if (data.msg == 'vid status wrong') {
          wx.showToast({
            title: 'vid status wrong',
            icon: 'none',
            duration: 2000
          })
          return nil;
        }
        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']
        var filename = data['vl']['vi'][0]['fn'];
        var fc_cnt  = seg_cnt
        var video_type
        var magic_str
        if (parseInt(seg_cnt) == 0) {
          seg_cnt = 1
        }else {
          fn_pre, magic_str, video_type = filename.split('.')
        }

        var part_urls = new Array()
        var total_size = 0
        var part_format_id
        for (var i = 1; i < (seg_cnt + 1); i++) {
          if (fc_cnt == 0) {
            var part_format_ids = data['vl']['vi'][0]['cl']['keyid'].split('.')
            part_format_id = part_format_ids[part_format_ids.length-1]
          }else {
            part_format_id = data['vl']['vi'][0]['cl']['ci'][i - 1]['keyid'].split('.')[1]
            filename = [fn_pre, magic_str, i.toString(), video_type].join('.')
          }
          requestVideoUrls(part_format_id, vid, filename, host, seg_cnt).then(function (response) {
        resolve(response);
         });
        }
      }
    })
    })
  }
  },
// 解析视频真正的地址
};

function requestVideoUrls(part_format_id, vid, fileName, host,videoCount) {
  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";
 
  //回调函数 
  return new Promise(function (resolve) {
    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;
          var vidoeSrc = String(url)
          videoSrcArr.push(vidoeSrc);
        }
        count++;
        // 判断视频是否全部获取，获取全部视频再返回
        if(count==videoCount){
          resolve(videoSrcArr);
          console.log(videoSrcArr);
        }
       
      }
    })
  })
}
module.exports = qqVideo