dimanche 28 juin 2015

Video does not resume after pausing

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