uni-app开发经验分享十九: uni-app对接微信小程序直播
uni-app对接微信小程序直播
1.登录微信小程序后台-点击>设置->第三方设置->添加直播插件
2.添加直播组件后->点击<详情> 记录这两个参数直播插件的appid和最新版本号
3. 打开项目,找到manifest.json这个文件
代码:
"plugins" : {"live-player-plugin" : {"version" : "1.1.9", //最新直播组件版本号"provider" : "wx********0" //直播appid}}
4.获取直播间列表
/*** 获取直播列表*/
public function getLive(){//获取access_tokenif($_COOKIE['access_token']){$token = $_COOKIE['access_token'];}else{$token=$this->getAccessToken();setcookie("access_token", $token, time()+7200);}$page = i('page', 0); //当前页码$rows = i('rows', 10); //每页记录条数//请求直播间列表接口$live_list_url='https://api.weixin.qq.com/wxa/business/getliveinfo?access_token='.$token;//需要传递的参数$data = array("start"=>$page,"limit"=>$rows);$data = json_encode($data);$res=$this->http_request($live_list_url,$data);//获得直播间列表$result = json_decode($res, true);$this->render('default', $result);
}
/*** 获取access_token*/
public function getAccessToken(){$appid='wx***********25';//小程序appid$appsecret='6ce*********d';//小程序appsecret$url="https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=".$appid."&secret=".$appsecret;$res=$this->http_request($url);$result = json_decode($res, true);$access_token=$result['access_token'];return $access_token;
}
//https请求(支持GET和POST)
function http_request($url,$data = null){$curl = curl_init();curl_setopt($curl, CURLOPT_URL, $url);curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE);curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE);if(!empty($data)){curl_setopt($curl, CURLOPT_POST, 1);curl_setopt($curl, CURLOPT_POSTFIELDS, $data);}curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);$output = curl_exec($curl);//var_dump(curl_error($curl));curl_close($curl);return $output;
}5.uni-app(vue.js)请求列表信息:methods: {getLiveList: function () {let that = this;var params = {page: this.page};that.$.request({url: this.Config.URL.get_live_list,data: params,success: function (data, status, msg, code) {if (data.room_info.length > 0) {for (var r = 0; r < data.room_info.length; r++) {data.room_info[r]['start_time'] = dateUtil.dateUtils.format(that.$.datetimeFormatter(data.room_info[r]['start_time']));}that.setData({live_rows: that.live_rows.concat(data.room_info),});} else {that.setData({flag: !1, ispage: !1})}}});},
}
6.获取的列表信息循环列表显示(根据页面需求自己写页面)需要在列表中加onclick点击事件,把当前房间的roomid传递到点击事件中
7.在点击事件中使用 navigator 组件跳转进入直播间//点击跳转直播页liveDetail(roomid){let roomId = roomid; // 填写具体的房间号,可通过下面【获取直播房间列表】 API 获取let customParams = encodeURIComponent(JSON.stringify({ path: 'pages/index/live', pid: 1 })) // 开发者在直播间页面路径上携带自定义参数(如示例中的path和pid参数),后续可以在分享卡片链接和跳转至商详页时获取,详见【获取自定义参数】、【直播间到商详页面携带参数】章节(上限600个字符,超过部分会被截断)wx.navigateTo({url: `plugin-private://wx2b0*******70/pages/live-player-plugin?room_id=${roomId}&custom_params=${customParams}`})},
转载于:https://blog.csdn.net/qq_33273556/article/details/108549977
uni-app开发经验分享十九: uni-app对接微信小程序直播相关推荐
- App前端,Web前端,后端,微信小程序到底该学啥?
互联网行业发展的速度之快,让每一个从事IT行业的人员目不暇接.作为IT行业的人才,需要不断地学习新知识,否则很容易落伍.2016年,人工智能与虚拟现实着实火了一把,当然,深入研究这两门技术的大多是大公 ...
- 分享下自己写的一个微信小程序请求远程数据加载到页面的代码
分享下自己写的一个微信小程序请求远程数据加载到页面的代码 1 思路整理 就是页面加载完毕的时候 请求远程接口,然后把数据赋值给页面的变量 ,然后列表循环 2 js相关代码 我是改的 onload ...
- 四,layaair对接微信小程序:分享
本来这系列的博文不准备再更新了,但由于项目后期(小项目)需要对接微信小程序的功能,诸如分享.排行榜之类.后期再考虑使用微信广告功能(这个目前有限制,如果达不到1000用户量的话,是不能接入广告的),由 ...
- app能不能跳转外部h5_轻羽微信小程序和H5的区别在哪里?主要有三点
随着移动互联网的发展,许多应用在不断的产生,要说现在更新快.开放功能多的应用,只能是微信小程序了.微信小程序开放了60多个流量入口,更新了各种新的功能,尤其是之前实现的页面跳转功能,给开发者带来了好消 ...
- python日程提醒小程序_用手机APP管理日程太繁琐?试试这个微信小程序
随着我们日常生活.学习以及工作的日益繁忙,合理安排自己的日程事项变得越来越重要.相信大家在自己的手机里也安装过一些任务管理APP,可是真正坚持用下来的人又有多少呢?如果你觉得手机里的任务管理APP功能 ...
- 关于Android开源库分享平台,(GitClub)微信小程序的开发体验
七八月份的深圳一直在下雨,总有人说雨天适合窝在家看书,对于程序开发者来说更是难得的学习机会.我们502工作室的小伙伴利用这个时间学习了一下微信小程序开发,并上线了一个GitClub小程序,目前功能有些 ...
- 微信小程序直播如何接入?开源代码接入案例分享
小程序直播组件接入指引 一.简介 小程序直播,是微信提供给小程序开发者的直播组件.通过调用该组件,商家可以在小程序中实现直播功能. 按下面的使用说明接入,在你的小程序中引入直播组件. 二.使用方法说明 ...
- 第十五周学习周记——微信小程序开发初步
第十五周学习周记 前言 一.小程序简介 二.小程序代码构成 1. JSON配置 2. WXML模板 3. WXSS样式 4. JS逻辑交互 总结 前言 这一周将开始微信小程序的学习. 一.小程序简介 ...
- 小程序一键分享html5,H5手机网站封装微信小程序并实现分享功能的教程
通过本文教程可以实现将H5手机网站直接封装成微信小程序,并且支持分享功能.但不支持微信支付功能. 说明:手机站域名必须开启https模式 第一步: 微信开发者工具中创建小程序,填写你自己的小程序App ...
最新文章
- Python中的shape和reshape()
- SAP生产订单预留相关的备忘录
- CodeForces - 622C Not Equal on a Segment(思维+水题)
- mysql索引底层图_MySQL索引底层数据结构
- 开发者调试工具Chrome Workspace
- lisp 提取字符串中的數字_Redis 数据结构之字符串的那些骚操作
- vim php psr,PHP编码规范(PSR-1)-基本代码规范
- _RecordsetPtr
- 校园网编写linux网络认证,个人心得:校园网linux锐捷认证ruijie(xrgsu)使用及xrgsu下载...
- 前沿分享|上海市新能源汽车数据平台 王成名: 车联网全景监控数据时空超融合数据库方案
- 实施ERP系统需要注意哪些方面?
- 宽带拨号找不到netcfg.hlp文件
- 基于.NET平台的分层架构实战(九)——数据访问层的第三种实现:基于NBear框架的ORM实现
- 泰坦尼克号生存预测(超详细)
- python 常见日期转换、excel时间转化、日期加N天、减N天等操作
- 传奇工程师卡马克入坑 AI:徒手一周实现反向传播和 CNN
- 计算机操作电脑试题评分标准,2014计算机一级上机试题(1—5套)评分标准.docx
- 4.4OC10-内存管理2-set方法的内存管理
- 数字电路实验怎么接线视频讲解_时间继电器怎么看图接线?这可是星三角接触器接线必备元件...
- 2022年计算机软件水平考试软件评测师(中级)练习题及答案
热门文章
- android 屏幕方向监听,Android如何监听屏幕旋转
- 你的名字烂大街了吗?数据揭开国人起名背后的秘密……
- USB ncm虚拟网卡
- STM32F103标准库开发:KEY按键实验
- 基本的信号——冲激信号与冲激序列
- 使用disk genius合并C盘和D盘
- 计算机标记的定义,标记网格法
- OGG12.1(LINUX) for 11G R2 RAC classical install 经典抽取模式单项同步配置OGG12.1
- html 图像处理 灰度图和浮雕图类PS
- 川土微电子 | CA-IF1051 CAN-FD收发器