從我的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