【报Bug】uniapp h5 video 播放后台后进入无法继续播放黑屏，滑动进度条也无法继续播放

分类：uni-app

bug反馈

产品分类： uniapp/H5

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： 10

HBuilderX类型：正式

HBuilderX版本号： 3.94

浏览器平台： Chrome

浏览器版本： 99

项目创建方式： HBuilderX

示例代码：

<video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url"
@error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls>
</video>

操作步骤：

<video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url"
@error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls>
</video>

预期结果：

无

实际结果：

无

bug描述：

uniapp h5 video 播放后台后进入无法继续播放黑屏，滑动进度条也无法继续播放

2024-01-30 20:18 负责人:无分享

2 个回复

JXWang

播放后台后进入是什么意思，请完整描述一下操作步骤。是在手机端还是pc端浏览器有问题？

喜欢技术的前端 - QQ---445849201

试试这个例子，可以正常播放，可能是视频源的问题

<template>  
    <view>  
        <video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="url" @error="videoErrorCallback"  
            @loadedmetadata="loadedmetadata" controls></video>  
    </view>  
</template>  
<script>  
    export default {  
        data() {  
            return {  
                poster: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/uni.png',  
                url: 'https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4',  
            }  
        },  
        methods: {  
            loadedmetadata(e){  
                console.log(e)  
            },  
            videoErrorCallback: function(e) {  
                console.log(e)  
                uni.showModal({  
                    content: e.target.errMsg,  
                    showCancel: false  
                })  
            }  
        }  
    }  
</script>  

<style>  
    .play {  
        width: 750rpx;  
    }  
</style>

要回复问题请先登录或注册

【报Bug】uniapp h5 video 播放后台后进入无法继续播放黑屏，滑动进度条也无法继续播放

示例代码：

<video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url"
@error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls>
</video>

操作步骤：

<video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url"
@error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls>
</video>

预期结果：

无

实际结果：

无

bug描述：

2 个回复

公告

相关问题

【报Bug】uniapp h5 video 播放后台后进入无法继续播放黑屏，滑动进度条也无法继续播放

示例代码： <video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url" @error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls> </video>

操作步骤： <video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url" @error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls> </video>

预期结果： 无

实际结果： 无

bug描述：

与内容相关的链接

2 个回复

公告

相关问题

示例代码：

<video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url"
@error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls>
</video>

操作步骤：

<video :poster="poster" show-loading class="play" id="myVideo" autoplay :src="episodeData.url"
@error="videoErrorCallback" @loadedmetadata="loadedmetadata" controls>
</video>

预期结果：

无

实际结果：

无