我正在尝试在 IE8 浏览器上动态播放 avi 视频
I am trying to play avi videos dynamically on IE8 browser
我正在尝试在 IE8 浏览器上动态播放 avi 视频我的视频是 AVI 格式,用户将上传到我的服务器。我有一些测试 html 代码,它可以在播放视频的地方使用。
<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 文件中建立我的视频列表,然后当有人点击视频时,我会用 [=29] 嵌入这个 html 代码=] 进入浏览器并希望播放视频。这是我的新 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>
我想要实现的是将点击的视频推送到由 javascript 创建的视频播放器子 div 中,然后目标是将其从父节点中删除,如果我需要。我并不担心那部分我只是想让视频播放。我在该页面中添加了与下方相同的 html 代码,但出于某种原因,我页面上的相同 html 代码也不起作用,但它可以独立运行。任何帮助将不胜感激 这确实必须适用于 IE8 我托管此网站的方式似乎有问题。当我说我让它与上面的代码一起工作时,那是因为这是一个包含本地视频的本地 html 文件。我正在尝试工作的文件正在通过 express 提供服务,即使视频与 html 文件存在于同一位置,它似乎也无法识别 src is.This 是我的节点代码的位置正在为我提供 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)
});
我发现了我自己的问题我必须做的是创建一个 public 文件夹并告诉 express 我想要服务器的文件在哪里。
app.use(express.static('public'))
现在一切正常,当有人点击我的视频时,我的视频就会播放。
我正在尝试在 IE8 浏览器上动态播放 avi 视频我的视频是 AVI 格式,用户将上传到我的服务器。我有一些测试 html 代码,它可以在播放视频的地方使用。
<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 文件中建立我的视频列表,然后当有人点击视频时,我会用 [=29] 嵌入这个 html 代码=] 进入浏览器并希望播放视频。这是我的新 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>
我想要实现的是将点击的视频推送到由 javascript 创建的视频播放器子 div 中,然后目标是将其从父节点中删除,如果我需要。我并不担心那部分我只是想让视频播放。我在该页面中添加了与下方相同的 html 代码,但出于某种原因,我页面上的相同 html 代码也不起作用,但它可以独立运行。任何帮助将不胜感激 这确实必须适用于 IE8 我托管此网站的方式似乎有问题。当我说我让它与上面的代码一起工作时,那是因为这是一个包含本地视频的本地 html 文件。我正在尝试工作的文件正在通过 express 提供服务,即使视频与 html 文件存在于同一位置,它似乎也无法识别 src is.This 是我的节点代码的位置正在为我提供 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)
});
我发现了我自己的问题我必须做的是创建一个 public 文件夹并告诉 express 我想要服务器的文件在哪里。
app.use(express.static('public'))
现在一切正常,当有人点击我的视频时,我的视频就会播放。