Video wird überhaupt nicht abgespielt. [JavaScript]

Question

Ich versuche, eine lokale Datei mit Videos zu lesen. Hier ist der Code. Ich habe Array verwendet, um die Videos hinzuzufügen und sie nacheinander abzuspielen, aber es wurde kein Video abgespielt.

var videos = new Array(); //("BigBuck.m4v","Video.mp4","BigBuck.m4v","Video2.mp4"); 
var currentVideo = 0; 

function nextVideo() { 
    // get the element 
    videoElement = document.getElementById("play-video"); 
    // remove the event listener, if there is one 
    videoElement.removeEventListener('ended', nextVideo, false); 

    // update the source with the currentVideo from the videos array 
    videoElement.src = videos[currentVideo]; 
    // play the video 

    videoElement.play() 

    // increment the currentVideo, looping at the end of the array 
    currentVideo = (currentVideo + 1) % videos.length 

    // add an event listener so when the video ends it will call the nextVideo function again 
    videoElement.addEventListener('ended', nextVideo, false); 
} 

function yesnoCheck() { 
    document.getElementById("filepicker").style.display = 'none'; 
} 

// add change event to pick up selected files 
document.getElementById("filepicker").addEventListener("change", function (event) { 

    var files = event.target.files; 
    // loop through files 
    for (var i = 0; i < files.length; i++) { 
     // select the filename for any videos 
     if (files[i].type == "video/mp4") { 
      // add the filename to the array of videos 
      videos.push(files[i].name); // work from webkitRelativePath; 
     } 
    }; 

    // once videos are loaded initialize and play the first one 
    nextVideo(); 

}, false); 

Irgendwelche Vorschläge? Vielen Dank.

Answer 1

Sie werden den Inhalt des Videos lesen müssen, nicht nur die src auf seinen Namen setzen. Sie können dies tun, indem Sie die FileReader verwenden.

Ich habe Ihren Code angepasst, aber ich habe es nicht getestet. Hier ist ein Arbeitsbeispiel auf , obwohl.

var videos = new Array(); //("BigBuck.m4v","Video.mp4","BigBuck.m4v","Video2.mp4"); 
var currentVideo = 0; 
var reader = new FileReader(); 
// get th eelement 
var videoElement = document.getElementById("play-video"); 


function nextVideo() { 
    // remove the event listener, if there is one 
    videoElement.removeEventListener('ended', nextVideo, false); 

    // read the file contents as a data URL 
    reader.readAsDataURL(videos[currentVideo]); 

    // increment the currentVideo, looping at the end of the array 
    currentVideo = (currentVideo + 1) % videos.length 

    // add an event listener so when the video ends it will call the nextVideo function again 
    videoElement.addEventListener('ended', nextVideo, false); 
} 

function yesnoCheck() { 
    document.getElementById("filepicker").style.display = 'none'; 
} 

// add change event to pick up selected files 
document.getElementById("filepicker").addEventListener("change", function (event) { 

    var files = event.target.files; 
    // loop through files 
    for (var i = 0; i < files.length; i++) { 
     // select the filename for any videos 
     if (files[i].type == "video/mp4") { 
      // add the whole file to the array 
      videos.push(files[i]); 
     } 
    }; 
    // once videos are loaded initialize and play the first one 
    nextVideo(); 

}, false); 
// once the file is fully read 
reader.addEventListener('load', function() { 
    // you have the data URL in reader.result 
    videoElement.src = reader.result; 
    // play the video 
    videoElement.play() 
});