XHR加载视频 [英] XHR to load video
问题描述
如果没有深入了解我为什么使用XHR的详细信息，有人能告诉我如何让以下工作吗？我的目标是首先加载视频数据，然后将其放入视频标记的来源。
Without getting into the details of why I'm using XHR, can anyone tell me how to get the below to work doing so? My goal is to first load the video data and then place it into the video tag's source.
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
window.onload = function() {
var elem = document.getElementById("myVideo");
var req = new XMLHttpRequest();
req.onload = function () {
var blob_uri = URL.createObjectURL(this.response);
elem.appendChild(document.createElement("source"))
.src = blob_uri;
};
req.responseType = "blob";
req.open('GET', 'http://www.latentmotion.com/player/h264/clips/16154_2832659676_170_180.mp4', false);
req.send(null);
};
</script>
</head>
<body>
<video id="myVideo" width="600" height="334" controls></video>
</body>
</html>
推荐答案
参考此解决方法适用于Google Chrome，直到responseType =blob为实施。
Refer to this workaround for Google Chrome until responseType = "blob" is implemented.
如果您阅读了我的整个答案和链接，您会看到谷歌浏览器没有实际上还支持 responseType =blob。我给了你一个假设的实现，并使用 responseType =arraybuffer将你链接到一个解决方法。
If you read my whole answer and the link, you'd see Google Chrome doesn't actually support responseType = "blob" yet. I gave you a hypothetical implementation and linked you to a workaround using responseType = "arraybuffer".
这篇关于XHR加载视频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
