前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >3行代码实现小程序直播,带美颜,优惠券,抽奖,回放等功能

3行代码实现小程序直播,带美颜,优惠券,抽奖,回放等功能

作者头像
编程小石头
发布2020-08-11 15:22:40
9270
发布2020-08-11 15:22:40
举报

最近准备给自己的小程序做个直播功能,看下直播所需要的一些资质,瞬间被吓止步。后面发现小程序官方出了直播插件,这就为小程序接入直播提供的诸多便利。仅仅需要一些简单的配置,就可以轻松实现直播功能了。下面带大家来一步步给自己的小程序添加直播功能吧。

老规矩,先看效果图

一,首先要给你的小程序开通直播插件功能

登录我们的小程序后台,可以看到如下图所示的直播

点击一下,就可以进入小程序直播开通页面

注意我们上图红色框里的一些要求。必须要满足这些条件,才可以开通直播功能。更详细些的如下:

这就注定目前只能是通过认证的企业小程序才可以开通直播功能了。个人小程序目前是没法开通的。我刚开始还不信,用我的个人小程序试了试。结果就如下图,后面没办法就注册了一个企业小程序。

并且小程序的服务类目也要符合官方要求

到这里,才算真正开通了小程序直播功能。

二,创建直播间

点击创建直播间

选择手机直播

这里需要用一个实名认证的微信做主播端。

认证后如下:

这里设置直播的一些封面等信息

直播间创建成功后如下

这里的直播码,扫码后就可以直接开播了,还有这里的房间号一定要记牢,后面会用到。

这里可以往直播间里添加商品,优惠券等

下面就是根据官方文档来代码实现直播功能了

三,直播功能的代码实现

我们创建好直播间以后,接下来就要在小程序代码里实现直播功能了。

1,首先是要创建一个小程序项目

至于如何创建小程序项目我这里就不再教大家了,如果你还不知道如何创建小程序项目,建议你去翻下我的历史文章,或者看看我录的《10小时零基础入门小程序开发》 创建好的小程序项目如下

2,在app.json里添加直播插件

其实官方的接入文档写的很清晰了。下面把官方文档贴出来给大家:https://developers.weixin.qq.com/miniprogram/dev/framework/liveplayer/live-player-plugin.html

我们只需要把上面红色框里的代码复制到app.json里就可以了。记得把注释去掉

一定要记得,除了把注释去掉之外,其他的都不要做改动。

3,然后编写可以跳转到直播间的代码

代码很简单,就写一个button按钮,然后添加点击事件即可。

点击事件如下

其实官方文档里也有讲

直播房间的房间id我们在创建直播间成功后其实可以拿的到的。

到这里我们的直播功能就完整的实现了。下面我们来看看都有哪些直播状态

四,直播状态的显示

未开播状态,这里我们可以订阅开播提醒,等开播的时候,会有订阅消息提醒。

如果你订阅开播提醒了,还会有开播提醒

直播结束状态

主播暂时离开

主播端网络异常中断

主播端可以设置美颜等功能

并且我们的小程序直播间里可以设置优惠券,抽奖,添加商品。

直播结束后,还有回放功能

好,到这里就给大家把小程序直播功能完整的讲解完了。由于代码量太少,实现起来比较简单,所以就不给大家录讲解视频了。

下面把直播演示的视频发给大家看看。

https://www.bilibili.com/video/BV1Np4y1S7kV/

也可以去b站看更多小程序学习的视频

这里再强调下,个人小程序目前没有办法接入直播功能,必须是认证的企业小程序才可以。

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2020-08-05,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 编程小石头 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 老规矩,先看效果图
  • 一,首先要给你的小程序开通直播插件功能
  • 二,创建直播间
  • 三,直播功能的代码实现
    • 1,首先是要创建一个小程序项目
      • 2,在app.json里添加直播插件
        • 3,然后编写可以跳转到直播间的代码
        • 四,直播状态的显示
        相关产品与服务
        云直播
        云直播(Cloud Streaming Services,CSS)为您提供极速、稳定、专业的云端直播处理服务,根据业务的不同直播场景需求,云直播提供了标准直播、快直播、云导播台三种服务,分别针对大规模实时观看、超低延时直播、便捷云端导播的场景,配合腾讯云视立方·直播 SDK,为您提供一站式的音视频直播解决方案。
        领券
        问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档