2017-01-16 7 views
-1

Я пытаюсь динамически воспроизводить видео avi на браузере IE8, мои видео находятся в формате AVI, который пользователь загрузит на мой сервер. У меня есть некоторый тестовый html-код, и это работает там, где он воспроизводит видео.Я пытаюсь динамически воспроизводить видео avi на браузере IE8

<html> 
<body> 
    <object id="MediaPlayer1" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" hspace="0" vspace="0" standby="Loading Microsoft Windows Media Player components..."> 
<param name="Filename" value="toy_plane_liftoff.avi""> 

<embed type="application/x-mplayer2" 
pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" name="mediaplayer1" autoplay="false" autostart="false" 
height="330" width="360" loop="false" controls="false" allowFullscreen="True" src="toy_plane_liftoff.avi""> 
</object> 
</body> 
</html> 

так после того, как я получил эту работу я решил создать свой список видео из моего файла JSon тогда, когда кто-то нажимает на видео, которое я бы встраивать этот HTML-код с JavaScript в браузере и, надеюсь, играть в видео , Это мой новый HTML

<html> 

<head> 
    <script> 
    function loadDoc(){ 
     var url = "./getJsonData"; 
     var xdr = new XDomainRequest(); 

     xdr.onload = function(){ 
      var videoName = []; 
      var obj; 
      var response = xdr.responseText; 
      obj = JSON.parse(response); 
      for(var i = 0; i < obj.SopVideo.length; i++){ 
       var something = obj.SopVideo[i]; 
       videoName.push(something[0].Name); 

      } 
      var list = document.createElement('ul'); 
      list.setAttribute('id', "videoList"); 
      for(var i = 0; i < videoName.length; i++){ 
       var item = document.createElement('li'); 
       var createA = document.createElement('a'); 
       createA.setAttribute('href', "#"); 
       item.setAttribute('id', videoName[i]); 


       item.appendChild(createA); 

       item.appendChild(document.createTextNode(videoName[i])); 
       list.appendChild(item); 
      } 

        document.getElementById('videoName').appendChild(list); 
        var ul = document.getElementById('videoList'); 
        ul.attachEvent('onclick', function(e) { 
          //alert(e.srcElement.nodeName); 
          var videoID = e.srcElement.id; 
          playVideo(videoID); 
        }); 


     }; 
     xdr.onerror = function() { 
      alert("error happened") 
     }; 
     xdr.open('get', url); 
     xdr.send(); 

    } 

    function playVideo(id){ 
     var hidInputValue = document.getElementById('hidInput').value; 



     if(hidInputValue == "true"){ 
     var elem = document.getElementById('videoPlayerChild'); 
     elem.parentNode.removeChild(elem); 
     } 
     var videoChildObject = document.createElement('div'); 
     videoChildObject.setAttribute('id', "videoPlayerChild"); 
     document.getElementById('videoPlayer').appendChild(videoChildObject); 

     var videoObject = '<object id="mediaplayer1" classid=CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" hspace="0" vspace="0" standby="Loading Microsoft Windows Media Player components...">' + 
          '<param name="Filename" value="'+id+'">'+ 
          '<embed type="application/x-mplayer2" pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" name="mediaplayer1" autoplay="false" autostart="false"'+ 
          'height="330" width="360" loop="false" controls="false" allowFullscreen="True" scr="'+id+'">'+ 
          '</object>'; 

     var content = document.querySelectorAll('[id="videoPlayerChild"]')[0]; 
     content.innerHTML = videoObject; 

    } 
    </script> 
</head> 

<body onload="loadDoc()"> 
    <div id="videoName"></div> 
    <div id="videoPlayer"> 
    </div> 
    <object id="MediaPlayer1" classid="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" hspace="0" vspace="0" standby="Loading Microsoft Windows Media Player components..."> 
<param name="Filename" value="toy_plane_liftoff.avi""> 

<embed type="application/x-mplayer2" 
pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" name="mediaplayer1" autoplay="false" autostart="false" 
height="330" width="360" loop="false" controls="false" allowFullscreen="True" src="toy_plane_liftoff.avi""> 
</object> 
    <input type="hidden" value="false" id="hidInput"> 
</body> 

</html> 

, что я пытаюсь добиться пихает видео, которое щелкнули в видеоплеер ребенка DIV, который создается с помощью JavaScript, то цель будет удалить его из ParentNode, если я необходимость. Я не беспокоюсь о той части, которую я просто пытаюсь воспроизвести. Я добавил тот же html-код, который работал ниже на этой странице, и по какой-то причине мой же html-код на моей странице тоже не работает, но работает независимо. Любая помощь будет принята с благодарностью за то, что это должно быть для IE8. Кажется, что-то не так с тем, как я размещаю этот сайт. Когда я сказал, что он работал с вышеуказанным кодом, это потому, что это локальный html-файл с локальным видео. мой файл, который я пытаюсь заставить работать, выполняется экспресс, даже несмотря на то, что видео существует в том же месте, что и файл html, он не кажется, что он распознает, где находится src. Это мой код узла, который служит мне моим html-файлом ,

app.get('/RapVideo', function(req, res) { 
res.sendFile(path.join(__dirname + '/test/videotest.html')) 
}); 

// my app is listening on localhost port 8080 for the post to be called 
var server = app.listen(8080, function() { 
    console.log('Listening on port ' + server.address().port) 
}); 

ответ

1

я понял, мой собственный вопрос, что я должен был сделать, это создать общую папку и сказать выразить, где файлы, которые я хочу сервер есть.

app.use(express.static('public')) 

теперь все работает, и мои видео играют, когда кто-то нажимает на них.