微信小程序如何播放腾讯视频的实现


Posted in Javascript onSeptember 20, 2019

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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用javascript将数据库中的TEXT类型数据动态赋值到TEXTAREA中
Apr 20 Javascript
csdn 论坛技术区平均给分功能
Nov 07 Javascript
js 判断文件类型并控制表单提交示例代码
Nov 14 Javascript
JS onmousemove鼠标移动坐标接龙DIV效果实例
Dec 16 Javascript
js函数在frame中的相互调用详解
Mar 03 Javascript
JS获取网页图片name属性的方法
Apr 01 Javascript
微信 java 实现js-sdk 图片上传下载完整流程
Oct 21 Javascript
基于vue监听滚动事件实现锚点链接平滑滚动的方法
Jan 17 Javascript
bootstrap+jquery项目引入文件报错的解决方法
Jan 22 jQuery
vue 全局环境切换问题
Oct 27 Javascript
JS判断浏览器类型与操作系统的方法分析
Apr 30 Javascript
如何使用JavaScript检测空闲的浏览器选项卡
May 28 Javascript
Vue+iview+webpack ie浏览器兼容简单处理
Sep 20 #Javascript
微信小程序跳转到其他网页(外部链接)的实现方法
Sep 20 #Javascript
微信用户访问小程序的登录过程详解
Sep 20 #Javascript
解决layUI的页面显示不全的问题
Sep 20 #Javascript
小程序如何获取多个formId实现详解
Sep 20 #Javascript
SSM+layUI 根据登录信息显示不同的页面方法
Sep 20 #Javascript
使用Layui搭建后台管理界面的操作方法
Sep 20 #Javascript
You might like
php笔记之:数据类型与常量的使用分析
2013/05/14 PHP
PHP与Java对比学习日期时间函数
2016/07/03 PHP
yii2中关于加密解密的那些事儿
2018/06/12 PHP
PHP实现将base64编码字符串转换成图片示例
2018/06/22 PHP
jquery+json实现的搜索加分页效果
2010/03/31 Javascript
JQuery1.6 使用方法三
2011/11/23 Javascript
JQuery的read函数与js的onload不同方式实现
2013/03/18 Javascript
判断js对象是否拥有某一个属性的js代码
2013/08/16 Javascript
jquery实现瀑布流效果分享
2014/03/26 Javascript
Angular 常用指令实例总结整理
2016/12/13 Javascript
vue调用高德地图实例代码
2017/04/28 Javascript
webpack+vuex+axios 跨域请求数据的示例代码
2018/03/06 Javascript
vue+element-ui+ajax实现一个表格的实例
2018/03/09 Javascript
Vue使用Three.js加载glTF模型的方法详解
2020/06/14 Javascript
给Python入门者的一些编程建议
2015/06/15 Python
常见python正则用法的简单实例
2016/06/21 Python
Python面向对象编程基础解析(一)
2017/10/26 Python
Python中字典的浅拷贝与深拷贝用法实例分析
2018/01/02 Python
python3写的简单本地文件上传服务器实例
2018/06/04 Python
详解Python中打乱列表顺序random.shuffle()的使用方法
2019/11/11 Python
pytorch实现从本地加载 .pth 格式模型
2020/02/14 Python
解决python虚拟环境切换无效的问题
2020/04/30 Python
python中id函数运行方式
2020/07/03 Python
python动态规划算法实例详解
2020/11/22 Python
荷兰多品牌网上鞋店:Stoute Schoenen
2017/08/24 全球购物
C语言50道问题
2014/10/23 面试题
品学兼优的大学生自我评价
2013/09/20 职场文书
工程管理专业个人求职信范文
2013/12/07 职场文书
气象学专业个人求职信
2014/04/22 职场文书
讲党性心得体会
2014/09/03 职场文书
公务员群众路线专题民主生活会发言材料
2014/09/17 职场文书
硕士毕业论文导师评语
2014/12/31 职场文书
大学考试作弊检讨书
2015/05/06 职场文书
2016年春节慰问信息大全
2015/11/30 职场文书
2016大学军训心得体会
2016/01/11 职场文书
试了下Golang实现try catch的方法
2021/07/01 Golang