获取视频进度记忆进行播放

1.HTML代码

<form id="video-form" action="${s.base}/courseComment/doVideo.html" method="post">
	<div id="course-video" class="course-video">
		<video id="video" width="100%" src="${courseSection.videoUrl}" height="100%" controls preload>
			<source  type="video/mp4"/>
		</video>
        <input type="hidden" name="sectionId" value="${(courseSection.id)!}"/>
        <input type="hidden" name="courseId" value="${(courseSection.courseId)!}"/>
		<input type="hidden" id="rate" name="rate" value="${(result.rate)!}"></input>
		<input type="hidden" id="beginTime" name="beginTime" value="${(courseSection.beginTime)!}"></input>
		<input type="hidden" id="lastTime"></input>
	</div>
</form>

2.在进入该页面方法中封装好视频播放进度信息

UserCourseSection result = userCourseSectionService.queryLatest(userCourseSection);
mv.addObject("result",result);

3. JS代码

//根据id获取视频信息
myVid = document.getElementById("video");
//获取数据库保存上次播放进度
myVid.currentTime = ${(result.beginTime)!};
getvideoprogress();
	function getvideoprogress() {
		var id = setInterval(frame,10);
			function frame() {
				var ls = myVid.duration.toFixed(0);
				$("#lastTime").val(ls);
				var bg = myVid.currentTime.toFixed(0);
				$("#beginTime").val(bg);
				var bili = (myVid.currentTime.toFixed(0) / myVid.duration.toFixed(0)) * 100;
				$("#rate").val(bili.toFixed(0));
					}
				}

4.监听页面关闭或离开时提交当前视频信息

	//路径是FORM标签中action="${s.base}/courseComment/doVideo.html" method="post"
	window.onbeforeunload = function (ev) {
		ev.returnValue = "确定退出?";
        $("#video-form").ajaxSubmit({
			datatype: "JSON",
            success: function (resp) {
            var resp = $.parseJSON(resp);
            }
        })
	};

5. 处理层方法

/**
	 * 获取视频信息
	 */
	@RequestMapping(value = "/doVideo")
	@ResponseBody
	public void doVideo(HttpServletRequest request,UserCourseSection userCourseSection) throws ParseException {
		//获取当前用户id
		Long userId = SessionContext.getUserId();
		Long sectionId = userCourseSection.getSectionId();
		Long courseId = userCourseSection.getCourseId();
		//设置查询条件
		UserCourseSection userCourseSection1 = new UserCourseSection();
		userCourseSection1.setUserId(userId);userCourseSection1.setCourseId(courseId);userCourseSection1.setSectionId(sectionId);
		//查找数据库有无该条数据
		UserCourseSection userCourseSections = userCourseSectionService.queryOne(userCourseSection1);
		//判断观看量是不是100
		if (userCourseSections == null){
			if (userCourseSection.getRate() >= 99){
				userCourseSection.setLookCount(1);
			}
			userCourseSection.setUserId(userId);
			userCourseSectionService.createSelectivity(userCourseSection);
		}else {
			if (userCourseSection.getRate() >= 99 ){
				userCourseSections.setLookCount(userCourseSections.getLookCount() + 1);
			}
			userCourseSections.setBeginTime(userCourseSection.getBeginTime());
			BigDecimal sumTime = userCourseSections.getSumTime();
			userCourseSections.setSumTime(sumTime.add(userCourseSection.getBeginTime()));
			userCourseSections.setRate(userCourseSection.getRate());
			userCourseSectionService.updateSelectivity(userCourseSections);
		}
	}