video.js - 奇怪的错误 - 视频 js 错误行 21 或 449 - mp4 未加载/只是旋转

Question

刚遇到奇怪的错误。

在某些装有最新版本的 Chrome (26.0.1410.43m) 和 video-js 的计算机上，视频不会加载，旋转器只会继续旋转。请注意，在具有相同版本 Chrome 的另一台计算机上它可以正常工作。

即:

1. 计算机 1 - Chrome 26.0.1410.43m - 无法加载
2. 计算机 1 - Internet Explorer 9 - 加载
3. 计算机 2 - Chrome 26.0.1410.43m - 加载
4. 计算机 2 - 所有其他浏览器 - 加载

Chrome 中给出的无法正常工作的错误如下。

解决计算机 1 上的错误的方法是将文件转换为 .webm 格式。

 Event, type: "error", isDefaultPrevented: function, timeStamp: 1365411449401, vdata1365411437555: true…}
altKey: undefined
attrChange: undefined
attrName: undefined
bubbles: false
button: undefined
cancelable: true
charCode: undefined
clientX: undefined
clientY: undefined
ctrlKey: undefined
currentTarget: video#example_video_1_html5_api.vjs-tech
accessKey: ""
attributes: NamedNodeMap
autoplay: false
baseURI: "http://kurssajten.balansekonomi.se/start.php?module=ks_part07&action=start"
buffered: TimeRanges
childElementCount: 0
childNodes: NodeList[2]
children: HTMLCollection[0]
classList: DOMTokenList
className: "vjs-tech"
clientHeight: 309
clientLeft: 0
clientTop: 0
clientWidth: 550
contentEditable: "inherit"
controller: null
controls: false
currentSrc: "https://s3-eu-west-1.amazonaws.com/kurssajten-cdn/uploads/media/ks_part07-start-introduction.mp4"
currentTime: 0
dataset: DOMStringMap
defaultMuted: false
defaultPlaybackRate: 1
dir: ""
draggable: false
duration: 80.17066955566406
ended: false
error: MediaError
firstChild: text
firstElementChild: null
height: 0
hidden: false
id: "example_video_1_html5_api"
initialTime: 0
innerHTML: "↵                    ↵                "
innerText: ""
isContentEditable: false
lang: ""
lastChild: text
lastElementChild: null
localName: "video"
loop: false
mediaGroup: ""
muted: false
namespaceURI: "http://www.w3.org/1999/xhtml"
networkState: 0
nextElementSibling: img.vjs-poster
nextSibling: img.vjs-poster
nodeName: "VIDEO"
nodeType: 1
nodeValue: null
offsetHeight: 309
offsetLeft: 0
offsetParent: div#example_video_1.video-js vjs-default-skin vjs-playing
offsetTop: 0
offsetWidth: 550
onabort: null
onbeforecopy: null
onbeforecut: null
onbeforepaste: null
onblur: null
onchange: null
onclick: null
oncontextmenu: null
oncopy: null
oncut: null
ondblclick: null
ondrag: null
ondragend: null
ondragenter: null
ondragleave: null
ondragover: null
ondragstart: null
ondrop: null
onerror: null
onfocus: null
oninput: null
oninvalid: null
onkeydown: null
onkeypress: null
onkeyup: null
onload: null
onmousedown: null
onmousemove: null
onmouseout: null
onmouseover: null
onmouseup: null
onmousewheel: null
onpaste: null
onreset: null
onscroll: null
onsearch: null
onselect: null
onselectstart: null
onsubmit: null
onwebkitfullscreenchange: null
onwebkitfullscreenerror: null
onwebkitkeyadded: null
onwebkitkeyerror: null
onwebkitkeymessage: null
onwebkitneedkey: null
outerHTML: "<video id="example_video_1_html5_api" class="vjs-tech" preload="none" data-setup="{}">↵                    ↵                </video>"
outerText: ""
ownerDocument: document
parentElement: div#example_video_1.video-js vjs-default-skin vjs-playing
parentNode: div#example_video_1.video-js vjs-default-skin vjs-playing
paused: false
playbackRate: 1
played: TimeRanges
player: Class
poster: ""
prefix: null
preload: "none"
previousElementSibling: null
previousSibling: null
readyState: 1
scrollHeight: 309
scrollLeft: 0
scrollTop: 0
scrollWidth: 550
seekable: TimeRanges
seeking: false
spellcheck: true
src: ""
startTime: 0
style: CSSStyleDeclaration
tabIndex: -1
tagName: "VIDEO"
textContent: "↵                    ↵                "
textTracks: TextTrackList
title: ""
translate: true
vdata1365411437555: 10
videoHeight: 308
videoWidth: 550
volume: 1
webkitAudioDecodedByteCount: 6771
webkitClosedCaptionsVisible: false
webkitDecodedFrameCount: 0
webkitDisplayingFullscreen: false
webkitDroppedFrameCount: 0
webkitHasClosedCaptions: false
webkitPreservesPitch: true
webkitPseudo: ""
webkitShadowRoot: null
webkitSupportsFullscreen: true
webkitVideoDecodedByteCount: 332046
webkitdropzone: ""
width: 0
__proto__: HTMLVideoElement
data: undefined
detail: undefined
eventPhase: 2
fromElement: undefined
handler: undefined
isDefaultPrevented: function returnFalse(){return false}
isPropagationStopped: function returnTrue(){return true}
keyCode: undefined
metaKey: undefined
newValue: undefined
offsetX: undefined
offsetY: undefined
originalEvent: Event
pageX: undefined
pageY: undefined
prevValue: undefined
relatedNode: undefined
relatedTarget: undefined
result: undefined
screenX: undefined
screenY: undefined
shiftKey: undefined
srcElement: video#example_video_1_html5_api.vjs-tech
target: div#example_video_1.video-js vjs-default-skin vjs-playing
timeStamp: 1365411449401
toElement: undefined
type: "error"
vdata1365411437555: true
view: undefined
wheelDelta: undefined
which: undefined
__proto__: Object

Answer 1

我几乎可以肯定这就是我昨天遇到的确切问题，同样是针对 Chrome。 Chrome无法播放.mp4，卡在视频源第一行的.mp4上。您很可能将它们列为如下所示:

<source src="/video/TVC-Intro.mp4" type='video/mp4'>
<source src="/video/TVC-Intro.webm" type='video/webm'>
<source src="/video/TVC-Intro.ogv" type='video/ogg'>

将 webm 标签移到 mp4 上方，我敢打赌它会起作用。那是我找到的简单解决方案。