1***@qq.com
1***@qq.com
  • 发布:2024-08-30 14:52
  • 更新:2024-08-30 14:52
  • 阅读:78

live-pusher在app端总是黑屏 急急急急

分类:uni-app
<template>  
  <movable-area class="movable-area">  
    <movable-view direction="all" :inertia="true" :class="localClass" :x="x" :y="y">  
      <view class="stream-box" @click="switchScreen">  
        <live-pusher  
          class="stream"  
          :url="pusher.rtmp"  
          :mode="pusher.mode"  
          :autopush="pusher.autoPush"  
          :enable-camera="pusher.enableCamera"  
          :enable-mic="pusher.enableMic"  
          :muted="!pusher.enableMic"  
          :enable-agc="pusher.enableAgc"  
          :enable-ans="pusher.enableAns"  
          :auto-focus="pusher.autoFocus"  
          :zoom="pusher.enableZoom"  
          :min-bitrate="pusher.minBitrate"  
          :max-bitrate="pusher.maxBitrate"  
          :video-width="pusher.videoWidth"  
          :video-height="pusher.videoHeight"  
          :beauty="pusher.beautyLevel"  
          :whiteness="pusher.whitenessLevel"  
          :orientation="pusher.videoOrientation"  
          :aspect="pusher.videoAspect"  
          :device-position="pusher.frontCamera"  
          :remote-mirror="pusher.enableRemoteMirror"  
          :local-mirror="pusher.localMirror"  
          :audio-quality="pusher.audioQuality"  
          :audio-volume-type="pusher.audioVolumeType"  
          :audio-reverb-type="pusher.audioReverbType"  
          :beauty-style="pusher.beautyStyle"  
          :filter="pusher.filter"  
          @statechange="pusherStateChangeHandler"  
          @netstatus="pusherNetStatus"  
          @error="pusherErrorHandler"  
          @audiovolumenotify="pusherAudioVolumeNotify"  
        ></live-pusher>  
      </view>  
    </movable-view>  
  </movable-area>  
</template>  

<script lang="ts" setup>  
import { useCall } from '@/store'  
import { CallStatus } from '@/request/apis/call/types'  

interface Props {  
  localClass: string // 本地样式  
  currentLocalScreen: boolean // 当前是本地还是远端  
}  

const props = withDefaults(defineProps<Props>(), {  
  localClass: 'small-view',  
  currentLocalScreen: true  
})  

const callStore = useCall()  
const callStatus = ref(callStore.call.callStatus)  
const pusher = ref(callStore.call.pusher)  

watchEffect(() => {  
  callStatus.value = callStore.call.callStatus  
  pusher.value = callStore.call.pusher  
  console.log('pusher.value :>> ', pusher.value)  
})  

// 可移动窗口的默认位置top:8% right:10%  
const windowWidth = uni.getSystemInfoSync().windowWidth  
const windowHeight = uni.getSystemInfoSync().windowHeight  
// 手机设备宽度 - 小窗口宽度 - 偏移值  
const x = windowWidth - 178 / 2 - 18 / 2  
const y = windowHeight * 0.1  
/**  
 * 屏幕切换  
 */  
const switchScreen = () => {  
  if (callStatus.value !== CallStatus.CONNECTED || props.localClass === 'large-view') return  
  callStore.call.bigScreenUserId = props.currentLocalScreen ? 'player' : 'localVideo'  
}  

/**  
 * 状态变化事件  
 */  
const pusherStateChangeHandler = (e: any) => {  
  console.log('状态变化事件:pusher :>> ', e)  
}  

/**  
 * 网络状态通知  
 */  
const pusherNetStatus = (e: any) => {  
  // console.log('网络状态通知:pusher :>> ', e)  
}  

/**  
 * 渲染错误事件  
 */  
const pusherErrorHandler = (e: any) => {  
  console.log('渲染错误事件:pusher :>> ', e)  
}  

/**  
 * 返回麦克风采集的音量大小  
 */  
const pusherAudioVolumeNotify = (e: any) => {  
  // console.log('返回麦克风采集的音量大小:pusher :>> ', e)  
}  
</script>  

<style lang="scss" src="./style/index.scss" scoped></style>  
<style lang="scss" scoped>  
.movable-area {  
  width: 100%;  
  height: 100%;  
  position: fixed;  
  z-index: 999;  
}  
</style>  
2024-08-30 14:52 负责人:无 分享
已邀请:

要回复问题请先登录注册