3分钟入门微信小程序直播

效果预览

enter image description here

开发环境搭建
安装微信开发者工具

  相对于之前微信之前的产品来讲。小程序在发布之初就面向开发者开放微信开发者工具。使开发者更加方便的开发和调试小程序。咱们从官网下载安装。
官网下载地址。如今只支持windows和mac。安装完成以后咱们就可使用建立小程序了。html

建立初始工程

  打开微信微信开发者工具,选择项目目录。注意这里的项目目录最好是空文件夹或者当前目录下面没有package.json文件。而后输入appid和项目名称。appid能够在官网申请
enter image description here
点击肯定就会生成小程序项目。git

直播功能实现
开通直播接口

  注意如今直播对于的接口只对如下类目开放。
enter image description here
若是你发现你在接口设置显示没有开通。则须要修改小程序的服务类目。修改完成以后。须要再次回到接口设置里面。开启实时播放音视频流对于接口权限。
enter image description heregithub

直播组件

  文档地址 小程序直播主要是会用到2个组件:
json

  • live-player:实时音视频播放

  • live-pusher:实时音视频录制

  • 每一个组件都对应一个api。能够根据上述文档查看。并且微信也提供了测试的demo咱们能够直接拿来运行。
    我这里只是把小程序官网提供直播相关的的demo组装在一块儿。

    申请腾讯云直播

      咱们已经根据文档搭建出来了直播小程序的demo。可是咱们要怎么才能真正在本身的程序里面看到一个手机推流,另一个手机观看呢?这里方案有不少。本身搭建也能够。使用阿里云的直播也能够。我这里用了一个最简单的方法。直接利用腾讯云的云直播平台。首先开通腾讯云云直播。而后点击推流生成器
    enter image description here
    而后复制上面的推流地址和播放地址到小程序里面。小程序

    #推流地址修改
    pages/player/player.wxml里面的url
    #播放地址修改
    pages/pusher/pusher.wxml里面的url

    修改对应的地方替换。这样就能够实现咱们上面gif动画里面的效果啦。
    demo地址windows

    相关文章
    相关标签/搜索