小程序直播开发demo

参考文档:3分钟入门微信小程序直播 - 进击的小羊驼 - 博客园

今天研究了新东西小程序的直播开发

这个东西我研究了整整一下午 快给我整哭了

我的demo地址:https://github.com/AloneYan/WeChat-live.git  

2020/11/2源码迁移到gitee:WeChat-live: 🐣 小程序直播demo

下面进入正题


首先你必须搞一个小程序公众平台的账号

注册一个自己的小程序 获得自己的小程序id

这里的小程序类目是有限制的 自己到微信平台看就好

到设置里把这两个打开

到这里微信端的配置就完成了


然后你必须搞一个腾讯云账号

开通这云直播权限 它会赠送20gb流量给你 超出需要自己花钱

开通流程请参考下面的腾讯文档

腾讯文档 参考资料:直播 SDK简介_直播 SDK购买指南_直播 SDK操作指南-腾讯云

在自己的腾讯云后台找到云直播这一类目

在这里可以看到自己剩余的流量套餐

然后点开第二个域名管理

在这里面会看到两个域名 一个是推流域名 一个是播放域名

域名可以用自己的 (建议配置自己的域名,2019/2/26上线查看时发现赠送的播放域名已失效)

具体看下面的文档

腾讯文档:云直播 添加自有域名-控制台指南-文档中心-腾讯云-腾讯云

重点是  缺一不可!!!

再点开第三个接入管理选择直播码接入

生成推流地址~

到这里腾讯云端的配置就完成了


最后下载我的demo

修改project.config.json下的appid为自己小程序id

播放地址:修改pages / player / player.wxml里面的src 为腾讯云生成的推流播放地址

推流地址:修改pages / pusher / pusher.wxml里面的url 为腾讯云生成的推流地址

这样就可以运行啦

demo中要用到的主要就是两个标签

<live-player>播放

<live-pusher>推流

具体的参数配置可以看下面的相关文档

腾讯文档 小程序相关标签:直播 SDK <live-pusher> 标签-API 文档-文档中心-腾讯云-腾讯云

另外小程序IM即时通讯Demo:即时通信 IM 快速入门(Android)-快速入门-文档中心-腾讯云-腾讯云

这里只是一个简单的小demo

后续难点遇到了我会再发出来~

————————————————————————————————————————

2019年11月12日更新

公司这个项目没做,后来我就没再研究这边了

今天上腾讯后台看了一下

好像是比去年更完善了

登录 - 腾讯云

建议大家去看一下

每一步都有很多腾讯官方的教程

还有交流群可加

有时间了我再更新这个教程文档

感谢大家的阅读~

  • 25
    点赞
  • 93
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 22
    评论
你想要一个小程序开发的示例demo吗?当然可以!你可以参考以下步骤来创建一个简单的小程序开发demo。 1. 首先,在微信开发者工具中创建一个新的小程序项目。 2. 在项目目录中,找到 `app.json` 文件,将其中的 `"cloud": true` 改为 `"cloud": "true"`,以启用开发能力。 3. 在微信开发者工具的左侧导航栏中,点击“开发”按钮,进入开发控制台。 4. 在开发控制台中,点击“数据库”菜单,然后创建一个新的集合,比如命名为 "demo"。 5. 在小程序项目的 `app.js` 文件中,通过 `wx.cloud.init()` 初始化开发环境。 6. 在需要使用开发的页面或组件中,引入 `wx.cloud` 模块,使用其中的方法进行数据操作。 下面是一个简单的示例代码,展示了如何在小程序页面中调用函数和操作数据库: ```javascript // 在页面中引入开发模块 const db = wx.cloud.database(); Page({ data: { todos: [] }, onLoad() { // 调用函数获取数据 wx.cloud.callFunction({ name: 'getTodos', success: res => { this.setData({ todos: res.result.data }); }, fail: err => { console.error(err); } }); }, addTodo() { // 向数据库添加数据 db.collection('demo').add({ data: { content: 'New todo', completed: false }, success: res => { console.log(res); }, fail: err => { console.error(err); } }); } }); ``` 在上面的示例中,我们在页面加载时调用了一个名为 "getTodos" 的函数来获取数据,并将数据存储在页面的 `data` 中。同时,我们还定义了一个 `addTodo` 方法,用于向数据库添加数据。 这只是一个简单的示例,你可以根据自己的需求进行扩展和修改。希望对你有所帮助!如果你有其他问题,欢迎继续提问。
评论 22
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

花贝是只猫

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值