兼容端
安卓 | 苹果 | Web | 鸿蒙 | 小程序 |
---|---|---|---|---|
✅ | ✅ | ❌ | ❌ | ❌ |
使用示例
vue
<template>
<!-- #ifdef APP -->
<scroll-view style="flex:1">
<!-- #endif -->
<view>
<button @click="handleRegisterLicense">注册License</button>
<button @click="handleRequestPermission">申请权限</button>
<button @click="handlePusher">打开推流视图 - Pusher</button>
<button @click="handlePlayer">打开拉流视图 - Player</button>
<button @click="handleSetVideoQuality">设置画面质量 - Pusher</button>
<button @click="handleStartPush">开启推流 - Pusher</button>
<button @click="handleStartPlayer">开启拉流 - Player</button>
</view>
<view v-if="state.pusher">
<text>直播推流</text>
<t-tlive-pusher
style="width: 200px;height: 300px;background-color: rgba(0, 0, 0, 0.1);"
ref="TlivePusher"
:protocol="2"
></t-tlive-pusher>
</view>
<view v-if="state.player">
<text>直播拉流</text>
<t-tlive-player
style="width: 200px;height: 300px;"
ref="TlivePlayer"
></t-tlive-player>
</view>
<!-- #ifdef APP -->
</scroll-view>
<!-- #endif -->
</template>
<script lang="uts">
import * as Tlive from "@/uni_modules/t-tlive"
type stateType = {
pusher: boolean;
player: boolean;
}
export default {
data() {
return {
state: {
pusher: false,
player: false
} as stateType
}
},
onReady(){
this.handleRegisterLicense()
},
methods: {
handleRegisterLicense() {
Tlive.loadLicence({
licenceURL: "",
licenceKey: "",
success: (result: Tlive.TTliveResult) => {
console.log(result)
},
fail: (result: Tlive.TTliveResult) => {
console.log(result)
}
} as Tlive.TTliveOptions)
},
handleRequestPermission(){
Tlive.requestPermission({
success: (result: Tlive.TTliveResult) => {
console.log(result)
},
fail: (result: Tlive.TTliveResult) => {
console.log(result)
}
} as Tlive.TTliveOptions)
},
handlePusher() {
this.state.pusher = true
},
handlePlayer(){
this.state.player = true
},
handleStartPush(){
(this.$refs['TlivePusher'] as TTlivePusherElement).startPush({
pushURL: "",
success: (result: Tlive.TTliveResult) => {
console.log(result)
},
fail: (result: Tlive.TTliveResult) => {
console.log(result)
}
} as Tlive.TTliveOptions)
},
handleSetVideoQuality() {
(this.$refs['TlivePusher'] as TTlivePusherElement).setVideoQuality({
videoFps: 24,
resolution: 19201080,
resolutionMode: 2,
videoBitrate: 1200,
minVideoBitrate: 800,
success: (result: Tlive.TTliveResult) => {
console.log(result)
},
fail: (result: Tlive.TTliveResult) => {
console.log(result)
}
} as Tlive.TTliveOptions)
},
handleStartPlayer() {
(this.$refs['TlivePlayer'] as TTlivePlayerElement).startLivePlay({
flvUrl: "",
success: (result: Tlive.TTliveResult) => {
console.log(result)
},
fail: (result: Tlive.TTliveResult) => {
console.log(result)
}
} as Tlive.TTliveOptions)
}
}
}
</script>
暴露的类型
ts
export type TTliveResult = {
code: number;
msg: string;
data?: any;
}
export type TTliveOptions = {
licenceURL?: string;
licenceKey?: string;
pushURL?: string; // 推流地址
resolution?: number; // 视频分辨率
resolutionMode?: number; // 视频模式
videoFps?: number; // 视频采集帧率
videoBitrate?: number; // 视频码率
minVideoBitrate?: number; // 最低视频码率
flvUrl?: string; // 拉流地址
fillMode?: number; // 拉流窗口适配
success?: (result: TTliveResult) => void;
fail?: (result: TTliveResult) => void;
}