html5视频在某些主机上不播放

从我的http://127.0.0.1 http服务器运行良好，并且通过“not”指定源标签中的mimi类型在上传到vistapanel.net主机时有效。有关代码的快照。html5视频在某些主机上不播放

<video id="vid" width="64" height="48" style="display:none"> 
     <source src="images/queryzoom.webmvp8.webm" /> 
     <source src="images/queryzoom.theora.ogv" /> 
</video> 
<video id="vid2" width="64" height="48" style="display:none"> 
     <source src="images/save.webmvp8.webm" /> 
     <source src="images/save.theora.ogv" /> 
</video> 
<canvas id="processCanvas" width="640" height="480" style="width:1px;height:1px" style="display:none"> 
</canvas>

...

function newFrame() { 
    frame++;  
    if (frame > 1000) { 
     frame = 0; 
     svideo.currentTime = 0; 
     jvideo.currentTime = 0; 
    }

...

if (frame == 200) { 
    jvideo.play(); 
}

...

if (frame > 200 && frame < 320) { 
    process.drawImage(jvideo, 0,0,640,480); 
    var TheImage = process.getImageData(0, 0, 640, 480); 
    var jpgdata = TheImage.data; 
    for (var i = 0, n = jpgdata.length; i < n; i += 4) { 
    if (jpgdata[i] < 80 && jpgdata[i+1] < 80 && jpgdata[i+2] > 128) { 
     jpgdata[i+3] = 0; 
    } 
    } 
    process.putImageData(TheImage, 0, 0); 
    gold = document.getElementById('processCanvas'); 
    ctx.fillRect(width-400,0,400,200); 
    fwidth=300; 
    ctx.drawImage(gold, width-180-(fwidth/2),0,fwidth,200); 
}

...

if (frame == 810) { 
    svideo.play(); 

}

...

if (frame > 800 && frame <1000) { 
    process.drawImage(svideo, 0,0,640,480); 
    if (frame <840) { 
     ctx.fillRect(width-400,0,(frame-800)*10,200); 
     var TheImage = process.getImageData(0, 0, 640, 480); 
     var jpgdata = TheImage.data; 
     for (var i = 0, n = jpgdata.length; i < n; i += 4) { 
     if (jpgdata[i] < 80 && jpgdata[i+1] < 80 && jpgdata[i+2] > 128) { 
      jpgdata[i+3] = 0; 
     } 
     } 
     process.putImageData(TheImage, 0, 0); 
     gold = document.getElementById('processCanvas'); 
     progress = (frame-800)/40; 
     ctx.drawImage(gold, 0, 0, (640 * progress), 480, (width - 360), 0, (150 * progress), 100);      
    } else { 
     var TheImage = process.getImageData(0, 0, 640, 480); 
     var jpgdata = TheImage.data; 
     for (var i = 0, n = jpgdata.length; i < n; i += 4) { 
     if (jpgdata[i] < 80 && jpgdata[i+1] < 80 && jpgdata[i+2] > 128) { 
      jpgdata[i+3] = 0; 
     } 
     } 
     process.putImageData(TheImage, 0, 0); 
     gold = document.getElementById('processCanvas'); 
     ctx.fillRect(width-400,0,400,200); 
     fwidth=300; 
     ctx.drawImage(gold, width-360,0,fwidth/2,100); 
    } 
}

...

}

...

var frame=0; 

var jvideo = document.getElementById("vid"); 
var svideo = document.getElementById("vid2"); 


var canvas = document.getElementById('processCanvas'); 
var process = canvas.getContext('2d'); 

newFrame();

它扮演的第一次，但未能在第2次打。我正在考虑需要重新加载和缺少主机上的支持以通过范围读取文件的问题。因此，将更改视频标签中的src，而不是通过将currentTime设置为零来重放 - 请注意，当currentTime未设置为视频播放时（）不会在开始时启动它。

希望有人已经解决/解决了这个问题？

公测http://sdfreelance.vistapanel.net/beta.html

来源

2011-03-29 Wayne

适用于此主机上的firefox 4.01。

来源

2011-05-02 15:53:34 Wayne

教科书的解决方案来重新加载视频是使用

if (frame > 1000) { 
    frame = 0; 
    svideo.load(); 
    jvideo.load(); 
}

工程与Firefox而不是Chrome浏览器。应该注意的是，改变视频的当前时间应该可以工作，但是由于主机问题（为html5视频设置apache是一个完全不同的问题），视频将继续处于播放模式，永远不会到video.ended = true;因此没有范围信息，范围值为零也不例外。

Firefox似乎正在使用视频缓存，而Chrome并非如此。

不是问题的答案，我想，但 -

什么可以做的是使用PHP应用程序建立一个正确的HTTP报头和视频循环不需要视频重启一遍又一遍deliever视频。

来源

2011-03-31 19:08:50 Wayne

html5视频在某些主机上不播放

回答

相关问题