I am using VideoJS to host a video in my MVC application. It is working except for one small issue. When I pause the video in Google Chrome, then resume it, the video breaks with the following error message:
A Network Error caused the video download to fail part-way.
Here is my relevant html code:
<div class="row">
<div class="col-lg-6 text-left">
<p>
<ul>
<li><a href="javascript: void(0);" id="video1">Video 1</a></li>
<li><a href="javascript: void(0);" id="video2">Video 2</a></li>
<li><a href="javascript: void(0);" id="video3">Video 3</a></li>
</ul>
</p>
</div>
<div class="col-lg-6">
<video id="videoPlayer" class="video-js vjs-default-skin" controls preload="auto" width="640" height="264">
</video>
</div>
</div>
And here is my javascript code:
<script type="text/javascript">
$(function() {
videojs("videoPlayer", {
"controls": true,
"loop": "false"
}, function () {
//
});
$('#video1').click(function() {
var myPlayer = videojs('videoPlayer');
myPlayer.src({ type: "video/mp4", src: "/Videos/Video1.mp4" });
myPlayer.play();
});
$('#video2').click(function () {
var myPlayer = videojs('videoPlayer');
myPlayer.src({ type: "video/mp4", src: "/Videos/Video2.mp4" });
myPlayer.play();
});
$('#video3').click(function () {
var myPlayer = videojs('videoPlayer');
myPlayer.src({ type: "video/mp4", src: "/Videos/Video3.mp4" });
myPlayer.play();
});
});
</script>
I tested this with other browsers. The issue only seems to occur using Google Chrome. It works fine in Internet Explorer and FireFox.
Aucun commentaire:
Enregistrer un commentaire