README
鹅直播小程序
wx13a74d0d3ab0942e (现网) 鹅直播
wxb58a41ffda339bf5 (测试) 鹅推流
wx0c3417205d9852a9 (主干) 鹅推流助手
注意：由于每个环境对应的union_id唯一，所以大车进各个环境时需要提交代码至对应环境
加开发者权限找**小白**
整体架构
风格指南
- 【modal】和【store】都放在根目录然后分好区，具体看
项目目录
变量命名
【文件夹】小写字母横杠命名：
live-room-horizon【组件内主文件命名】 统一采用index.*:
index.*【纯js(非组件)文件命名】：统一采用小驼峰命名:
voiceSpeed.js【类名】首字母大写驼峰命名:
TestClass【变量】首字母小写驼峰命名:
testValue【私有变量】下划线开头驼峰命名:
_privateValue【常量】大写字母下划线写法:
TEST_CONST【样式类名】小写字母横杠命名:
style-class
图片资源
- 超过20k的图片资源统一放CDN服务。
- 存放方式：B端现网访问 现网蓝悦2号7978 店铺，素材中心 -> 搜索分组"鹅直播素材（勿删）(12)"，将图片传入该文件夹即可。
- 取链接方式，F12打开控制台，找到对应图片链接，然后去掉?后面的搜索参数即为最终图片链接 比如： https://wechatapppro-1252524126.cos.ap-shanghai.myqcloud.com/appAKLWLitn7978/image/b_u_5b2225aa46488_oGKN7IvA/kvumosz20xq9.png?imageView2/2/w/200/q/60 -> https://wechatapppro-1252524126.cos.ap-shanghai.myqcloud.com/appAKLWLitn7978/image/b_u_5b2225aa46488_oGKN7IvA/kvumosz20xq9.png
分包异步化
由于主包限制2M，有些比较大的包在多个分包里都有用到，遂引入了分包异步化 大型SDK通用文件统一放在sdkpkg文件夹下，需要使用的包通过异步的方式引入使用，这里是异步载入的包进行执行，和import使用方式有所不一样，需要格外注意 示例代码
let Imsdk = null
require.async("../../sdkpkg/xiaoe-im-sdk.js").then(res => {
ImSdk = res
ImSdk.initReady({
config: config
})
})
项目目录
|- api // 统一接口封装（只允许在 store 内请求使用）
|- components // 公共组件（各模块内部的自行维护）
|- constants // 常量定义
|- libs // 通用函数
|- model // 核心业务逻辑封装
|- userinfo // 用户信息相关model， 基于功能模块进行分块即可，不用分具体页面这样，可以参考api目录的分层结构
|- layout // layout布局相关业务逻辑梳理
|- pages // 组件页面
|- example // 示例页面
|- components // 页面私有组件
|- index.js // Js 逻辑
|- index.wxml // 页面
|- store // 数据仓库
|- global // 所有页面共用store，存在于小程序的整个生命周期
|- page
|- common // 2个&2个以上的页面共用的store类放在这里，只是代码的复用，没有数据复现，需要销毁的场景数据还是得销毁
|- live-room-horizon // 横屏直播间页面store
|- discussion
|- messageStore.js // 具体的Store文件
|- live-room-vertical // 直播列表页面store
|- subpkg // 分包内容
|- live-pusher-h // 横屏推流页
|- live-pusher-v // 竖屏推流页
|- live-room-horizon // 横屏直播间
| - components // 页面私有组件
| - index.js // js逻辑
| - index.wxml // 页面
|- live-room-vertical // 竖屏直播间
|- sdkpkg
|- xiaoe-im-sdk.js // 各种静态sdk包，一些较大的SDK包可以放这里，然后通过分包异步化的方式引入执行 [分包异步化]()
|- workers // web-worker 预留文件夹
目录说明 - api
统一存放所有接口 URL，调用时使用对象的 Key 指代，避免接口发生变化需要修改多处地方
目录说明 - components
存放全局组件
模块内部的组件不允许放在该目录，应自行在模块内部新建 components 文件夹进行管理
目录说明 - constant
用于存放业务中需要使用的常量，统一收归，业务代码内需要写死参数的地方需要统一使用常量替代
目录说明 - libs
全局通用函数存放
目录说明 - model
全局通用的 Model，业务逻辑尽量按实例的维度收归在这里，Page进行负责页面渲染，Store充当中介用于斜街Page & Model；
- Model 应该继承自 CommonModel类(外部通过subscribe方法进行变更监听，model类通过inform通知外部更新)
目录说明 - store
数据仓库，用于衔接Model&Page，以共享数据的方式暴露，多个页面可以基于单个Store进行响应式页面更新，一个Page可能依赖多个Store进行数据更新
Store设计应该遵循以下原则
- Store constructor里面应该只提供 data 的默认值设置工作
- Store 应该提供一个init方法用于业务逻辑初始化，需要基于业务逻辑在 Page/Component 生命周期内调用
- Store 应该关注 Page/Component 销毁的时候遗留的数据状态 (这些状态会停留在内存中)
- 整个应用应关注定时器相关的销毁工作，小程序多个页面共用一个执行环境，离开一个页面不会销毁当前页面的环境状态
代码实例
// MyStore
import Store from "/libs/westore/index"
class MyStore extends Store {
constructor() {
super()
this.data = {
name: "默认名称",
remainTime: {
days: 0,
hours: 0,
minutes: 0,
seconds: 0
}
}
}
init() {
this.model = new Model()
this.model.subscribe(() => {
this.name = this.model.name
this.remainTime = this.model.remainTime
this.update()
})
}
}
expoort default new MyStore()
// Page
import myStore from '/path/myStore'
let data = myStore.data
// 依赖多个store的情况
/*
let data = {
my: myStore.data,
tab: tabStore.data
}
*/
Page({
data: data,
onLoad() {
// 需要手动赋值一下
this.data = data
myStore.bind(this)
// 多个store需要依次绑定
tabStore.bind(this)
myStore.init()
}
})
目录说明 - pages
存放主包页面
目录说明 - subpkg
子包目录， 存放子包，注意加载时机
目录说明
目录说明 - workers
web-worker 备用
接入组件
Npm 包接入规范
因 npm 包的大小会合并计算入 主/分包，未避免整体包体积超过 2M，引用的 npm 包不允许引用外部组件，如有特殊需求，请于 BokunLin 联系对齐。
以下规范了包的一些既定规则，建议按照规范开发，避免引起下层系统异常以及联调失败。
接口（interfacePre)
接口名必须以 _alive/mp/ 开头，该接口会通过直播网关转发到对应的下层系统，自定义接口名可以在通过接收参数 interfacePre 来获取；
网关侧接口对齐请联系
JessicaZhou对齐，会有基本的流量管控，不按规范请求可能引起下层系统承载压力过大产生异常
组件参数
固定事件
open
closed
待支持能力
- 助教能力