uni-app video组件 倍速失效

uni-app video组件 倍速失效

开发环境 版本号 项目创建方式
Windows 11 HBuilderX
产品分类:uniapp/App

PC开发环境操作系统:Windows

PC开发环境操作系统版本号:window 11

HBuilderX类型:Alpha

HBuilderX版本号:4.43

手机系统:Android

手机系统版本号:Android 12

手机厂商:iqoo

手机机型:iqoo Z1

页面类型:vue

vue版本:vue3

打包方式:云端

项目创建方式:HBuilderX

### 示例代码:

```html
<template>  
    <view style="margin-top: 250rpx;" >  
        <video id="videoRef" ref="videoRef"  
            src="http://192.168.4.1/media/Front/2025-02-19/2025-02-19-10-16-11/F_2025-02-19-10-16-12.mp4"  
            style="width: 100%;"  @play="onplay">  
        </video>  

        <button @click="stop" style="margin-bottom: 20rpx;">stop</button>  
        <button @click="speed" style="margin-bottom: 20rpx;">speed</button>  
        <button @click="play" style="margin-bottom: 20rpx;">play</button>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                videoContext: null,  
            };  
        },  
        onReady() {  
            this.videoContext = uni.createVideoContext('videoRef', this);  
        },  

        mounted() {  

        },  

        methods: {  
            onplay() {},  

            stop() {  
                this.videoContext.pause();  
            },  
            speed() {  
                this.videoContext.playbackRate(1.5);  
            },  

            play() {  
                this.videoContext.play()  
            }  
        }  
    };  
</script>  

操作步骤:

点击play播放按钮,再设置倍速按钮

预期结果:

倍速生效

实际结果:

倍速没有生效

bug描述:

video组件可以调用pause和play方法,但是playbackRate配置了(0.5、0.75、1.25、1.5)都不生效


更多关于uni-app video组件 倍速失效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

3 回复

找到原因了,ijkplayer开源库的issue有提到,无音频的视频 无法倍速播放 倍速无效;https://github.com/bilibili/ijkplayer/issues/5187; 不知道官方会不会修改一下底层库呢?

更多关于uni-app video组件 倍速失效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


短期不会修改底层ijkplayer库源码,建议有此需求的开发者开发uts插件解决。

根据你提供的代码和问题描述,uni-app video组件的倍速播放失效可能有以下几个原因:

  1. 视频格式兼容性问题:
  • 某些视频格式可能不支持倍速播放功能
  • 建议尝试使用.mp4格式的标准H.264编码视频测试
  1. 平台兼容性问题:
  • Android系统对video组件的倍速播放支持度不同
  • 部分Android厂商可能对原生播放器做了定制修改
  1. 代码调用时机问题:
  • 确保在视频开始播放后再调用playbackRate方法
  • 可以尝试在@play事件中设置倍速
  1. 云端打包问题:
  • 某些HBuilderX版本可能存在云端打包的兼容性问题
  • 建议尝试本地打包测试

建议修改代码测试:

methods: {
    onplay() {
        // 在播放事件中设置倍速
        this.$nextTick(() => {
            this.videoContext.playbackRate(1.5);
        });
    },
    speed() {
        // 确保视频正在播放时设置倍速
        this.videoContext.playbackRate(1.5);
    }
}
回到顶部