Perkara yang perlu dilakukan jika video html5 tidak boleh dimajukan pantas

Penyelesaian kepada masalah yang tidak boleh dibuat oleh video HTML5: 1. Buat acara papan kekunci "document.onkeyup = function (event){...}" 2. Cetak semua nama parameter yang diluluskan dalam permintaan ; 3. Dapatkan kedudukan di mana video perlu diletakkan berdasarkan nilai atribut Julat 4. Sekat sahaja pengecualian dalam tangkapan.

Persekitaran pengendalian tutorial ini: sistem Windows 10, versi HTML5, komputer Dell G3.

Apakah yang perlu saya lakukan jika video html5 saya tidak boleh dimajukan pantas?

＜video＞ Penyelesaian untuk menandai ke hadapan pantas tidak berkuat kuasa:

Dalam projek H5, gunakan teg 39000f942b2545a5315c57fa3276f220 untuk memainkan video, tetapi main balik ke hadapan pantas video tidak boleh dilangkau Ikuti ini Kaedah asli menyediakan tetapan pemantauan berikut:

var vol = 0.1;  //1代表100%音量，每次增减0.1
var time = 2; //单位秒，每次增减10秒
 
 
function listenKeyboard() {
    var videoElement = document.getElementById("video");
    document.onkeyup = function (event) {//键盘事件
 
        var e = event || window.event || arguments.callee.caller.arguments[0];
 
        //鼠标上下键控制视频音量
        if (e && e.keyCode === 38) {
            console.log("音量加1");
            // 按 向上键
            videoElement.volume !== 1 ? videoElement.volume += vol : 1;
            return false;
 
        } else if (e && e.keyCode === 40) {
            console.log("音量减1");
            // 按 向下键
            videoElement.volume !== 0 ? videoElement.volume -= vol : 1;
            return false;
 
        } else if (e && e.keyCode === 37) {
            console.log("倒退1秒");
            // 按 向左键
            videoElement.currentTime !== 0 ? videoElement.currentTime = videoElement.currentTime -= time : 1;
            return false;
 
        } else if (e && e.keyCode === 39) {
            console.log("前进2秒,当前时间是:"+videoElement.currentTime+",视频长度是："+videoElement.duration);
            // 按 向右键
            var currPlayTime = videoElement.currentTime ;
            if (currPlayTime !== videoElement.duration){
                var afterSetTime = currPlayTime + time ;
                console.log('afterSetTime should be :'+afterSetTime) ;
                videoElement.currentTime = afterSetTime ;
                console.log('afterSetTime is :'+videoElement.currentTime) ;
            }else {
                videoElement.currentTime = videoElement.currentTime + 1;
            }
            console.log("快进后的时间是:"+videoElement.currentTime);
            return false;
        } else if (e && e.keyCode === 32) {
            console.log("暂停");
            // 按空格键 判断当前是否暂停
            videoElement.paused === true ? videoElement.play() : videoElement.pause();
            return false;
 
        }
 
    }
}

Setiap kali anda memajukan pantas, video akan melompat ke permulaan dan dimainkan semula.

Kemudian saya fikir, setiap kali video dimainkan, strim fail yang dibaca mesti berbeza dari kedudukan fail yang sepadan. Sama seperti membelok halaman, nilai sempadan permulaan perlu diluluskan, jadi permintaan dicetak keluar Semua nama parameter diluluskan, tetapi kecuali untuk parameter perniagaan, tiada nilai parameter lain. Apabila anda melihat permintaan video selepas

, akan ada atribut Julat di kepala Menurut nilai atribut, anda boleh mendapatkan kedudukan di mana video itu perlu diproses dalam latar belakang. Kod khusus adalah seperti berikut:

        String rangeString = request.getHeader("Range");//如果是video标签发起的请求就不会为null
            if (StringUtils.isNotBlank(rangeString)){
                long range = Long.valueOf(rangeString.substring(rangeString.indexOf("=") + 1, rangeString.indexOf("-")));
                response.setHeader("Access-Control-Allow-Origin", "*");
                response.setHeader("Content-Type", "video/mp4");
                response.setHeader("content-disposition", "attachment;filename=" + URLEncoder.encode(file.getName() , "UTF-8"));
                int fileLength = (int)file.length() ;
                response.setContentLength(fileLength);//10000是视频文件的大小，上传文件时都会有这些参数的
                response.setHeader("Content-Range", String.valueOf(range + (fileLength-1)));//拖动进度条时的断点，其中10000是上面的视频文件大小，改成你的就好
                response.setHeader("Accept-Ranges", "bytes");
//            response.setHeader("Etag", "W/"9767057-1323779115364"");//上传文件时都会有这些参数的
                response.setHeader("Etag", "737060cd8c284d8af7ad3082f209582d");//上传文件时都会有这些参数的
            }

Kemudian, apabila menyahpepijat, anda akan mendapati bahawa setiap kali kedudukan main balik video diposisikan semula, permintaan baharu akan datang dengan julat tempoh main semula tertentu.

Terdapat satu lagi masalah kecil baharu, iaitu, semasa video dimainkan, latar belakang mengeluarkan aliran fail ke bahagian hadapan Jika masa ditetapkan semula pada masa ini, sambungan asal akan ditutup. Penutupan sambungan jenis ini tidak normal Mesej pengecualian untuk membatalkan sambungan akan dilaporkan, yang tidak perlu dikendalikan Jika anda tidak mahu melihat gesaan pengecualian ini, sekat sahaja pengecualian dalam tangkapan.

Pembelajaran yang disyorkan: "Tutorial Video HTML5"

Atas ialah kandungan terperinci Perkara yang perlu dilakukan jika video html5 tidak boleh dimajukan pantas. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!