关于uniapp的视频限制播放的实现

html部分

<view class="video-background-modal" v-for="(dataList,ids) in dataList" :key="ids">
 	<video :src="video_directory+dataList.video.videoPath" @timeupdate='timeupdate' show-fullscreen-btn="false" @play="getVideoId(dataList.video.id)" :id="dataList.video.id"  controls>
		<cover-view class="text-title-style">{{dataList.video.subject}}</cover-view>
		<cover-view class="text-title-times">{{dataList.video.playTimes}}次播放</cover-view>
	</video>
 </view>

JavaScript部分

 var that; 
 data(){
			 return{
			    dataList:[],
				video_directory:'',//视频保存路径的前缀
				stopVideo:true,//停止播放视频
				//currentTime: '', //记录当前时间
				isHasTime: 5 ,//默认允许播放时长
				fileId:null,//视频id
			 }
		 },
		 created(){
		 	that = this; 
			that.onLoadVideoData();
		 },
		 //实时获取播放时间节点
	timeupdate(e) {
			 
				   var currentTime = Number(e.detail.currentTime.toFixed(2))
				   var videoId = e.currentTarget.id;
				   var fileId = that.fileId;
				   //如果未登录就停止播放，并且跳转到登录页面
				   if(app.globalData.userInfo.loginStatus==0){
					   uni.createVideoContext(fileId).pause();
				   	uni.reLaunch({
				   		url:'/pages/login/login'
				   	})
				   }
				   //如果播放时长大于限制播放的时长就停止播放并且跳转到付费界面
		           if(currentTime>that.isHasTime){
					   that.stopVideo=false
					   //停止播放
					   uni.createVideoContext(fileId).pause();
					  app.globalData.imageInfoObj = {
					  	buyType:1,
					  	id:that.fileId
					  }
					   uni.navigateTo({
					   	   url:'/pages/payImageVideoMember/payImageVideoMember'
					   })
					   return
				   }
		   },
		   //获取当前播放视频的id
		   getVideoId(id){
			  // console.log("id:",id)
			   that.fileId = id
		   },

关注我的公众号SpaceObj 领取idea系列激活码