refactor(liveRoom): 优化直播室页面
- 移除静音提示按钮 - 添加诊断按钮配置 - 设置播放器容器大小 - 添加播放器 license配置 - 优化播放器初始化和播放逻辑 - 移除直播加载文本
This commit is contained in:
parent
450372ce84
commit
0a7ab15d29
@ -7,7 +7,6 @@
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="loading-text">直播加载中...</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
@ -47,11 +47,18 @@ const initializePlayer = async () => {
|
||||
preload: true,
|
||||
autoplay: true, // 改为 true
|
||||
muted: true, // 默认静音
|
||||
diagnosisButtonVisible:false,
|
||||
autoplayPolicy: {
|
||||
fallbackToMute: true
|
||||
},
|
||||
width: '100%', //容器的大小
|
||||
height: '100%', //容器的大小
|
||||
skinLayout: false,
|
||||
controlBarVisibility: 'never',
|
||||
license: {
|
||||
domain: "szjixun.cn",
|
||||
key: "OProxmWaOZ2XVHXLtf4030126521c43429403194970aa8af9"
|
||||
}
|
||||
}
|
||||
|
||||
player.value = new AliyunPlayer(playerConfig, (playerInstance) => {
|
||||
@ -59,6 +66,7 @@ const initializePlayer = async () => {
|
||||
if (isWechat) {
|
||||
console.log('当前是微信浏览器环境')
|
||||
const startPlay = () => {
|
||||
console.log('执行了startPlay')
|
||||
playerInstance?.play()
|
||||
document.removeEventListener('WeixinJSBridgeReady', startPlay)
|
||||
document.removeEventListener('touchstart', startPlay)
|
||||
@ -67,18 +75,13 @@ const initializePlayer = async () => {
|
||||
document.addEventListener('WeixinJSBridgeReady', startPlay)
|
||||
document.addEventListener('touchstart', startPlay)
|
||||
}
|
||||
|
||||
loading1.value = true
|
||||
playerInstance?.play()
|
||||
})
|
||||
|
||||
player.value.on('init', () => {
|
||||
console.log('init')
|
||||
loading1.value = true
|
||||
})
|
||||
|
||||
player.value.on('playing', () => {
|
||||
console.log('playing')
|
||||
loading1.value = false
|
||||
|
||||
})
|
||||
|
||||
player.value.on('error', handlePlayerError)
|
||||
@ -170,17 +173,6 @@ const tipOpen = () => {
|
||||
<div :id="playerId" class="w-full h-full"></div>
|
||||
<liveLoading :loading="loading1"></liveLoading>
|
||||
|
||||
<!-- 添加静音提示按钮 -->
|
||||
<div v-if="player?.muted"
|
||||
class="absolute left-1/2 top-1/2 transform -translate-x-1/2 -translate-y-1/2
|
||||
bg-black/70 px-4 py-2 rounded-full cursor-pointer z-[1001]"
|
||||
@click="unmutePlayer">
|
||||
<div class="flex items-center gap-2 text-white">
|
||||
<div class="i-carbon-volume-mute text-20px"></div>
|
||||
<span class="text-14px">{{ t('live_room.tap_unmute') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<transition name="fade">
|
||||
<div v-if="fullLive">
|
||||
<sideButton class="absolute top-196px right-0 z-999"></sideButton>
|
||||
@ -225,20 +217,8 @@ const tipOpen = () => {
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
#J_prismPlayer {
|
||||
width: 100%;
|
||||
height: 100% !important;
|
||||
|
||||
& > video {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<style scoped>
|
||||
|
||||
<style scoped lang="scss">
|
||||
/* 定义过渡动画 */
|
||||
.fade-enter-active {
|
||||
transition: opacity 1s ease;
|
||||
|
Loading…
Reference in New Issue
Block a user