uniapp APP端解决video seek跳转时间不准确的问题

	<video id="myVideo" ref="myVideo"
				poster="/static/images/videoPoster.png" 
				@timeupdate="timeupdate"
				:duration="duration"
				:current="currentTime"
				:src="localVideoPath"
				:advanced="advanced"
				object-fit="fill" 
				controls="true" 
				show-play-btn="true" 
				show-center-play-btn="true" 
				show-loading="true">
    </video>

 设置advanced

data() {
	return {
        //seek生效的关键代码
		advanced: [  
			{
				 "key": "enable-accurate-seek",  
				 "value": 1,  
				 "type": "player",  
			}
		]				
		currentTime: 0,
		videoUrl: '',
		localVideoPath: '',
	}
}

onload  方法

需要设置好video的src路径后再创建 uni.createVideoContext

 onLoad(e){
    //这里是先下载到本地,然后再播放的
	let localVideoPath = uni.getStorageSync(this.videoUrl);
    //网络地址可以正常跳转但是本地地址不行,设置之后就正常了
	this.localVideoPath = plus.io.convertLocalFileSystemURL(localVideoPath)
	this.$nextTick(() => {
		this.videoContext = uni.createVideoContext('myVideo',this)
		this.videoHeight = 450;
	})
	this.$forceUpdate()
},

seek 需要整型 

seek(time) {
	let currentTime = parseInt(time);
	this.currentTime = currentTime;
	this.videoContext.seek(currentTime);
	console.info("seek",currentTime)
	setTimeout(() => {
		this.videoContext.play();
	}, 200);
}

参考:video 组件 高阶晋级

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值