重现问题：
-
从服务器通过XMLHTTPRequest获取视频作为blob .
-
在本地沙箱文件系统上保存每个FileSystem API .
-
使用“FileEntry.toURL”-method创建视频标记 .
-
尝试在Android Chrome上玩 - >失败
-
尝试在桌面Chrome上玩 - >运行
在我看来，这是一个非常重要的特征 . 因为如果视频加载工作正常，我们就可以在智能手机和平板电脑上实现离线媒体应用，而不需要本机代码依赖 .
下载似乎正在运行 . 但是浏览器无法播放来自文件系统的视频 . 我尝试了与图像相同的用例 . 这很有效 . 请参阅http://sobek-agency.com/html5-file-api/的示例
见http://sobek-agency.com/html5-file-api/
源代码：
<!DOCTYPE html > <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"> </script> <script type="text/javascript"> var _fs; var imagefilename = "st-logo.png"; var videofilename = "st-is-coming.webm"; var diskSpaceRequired = 20 * 1024 * 1024; window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem; function errorHandler(e) { var msg = ''; switch (e.code) { case FileError.QUOTA_EXCEEDED_ERR: msg = 'QUOTA_EXCEEDED_ERR'; break; case FileError.NOT_FOUND_ERR: msg = 'NOT_FOUND_ERR'; break; case FileError.SECURITY_ERR: msg = 'SECURITY_ERR'; break; case FileError.INVALID_MODIFICATION_ERR: msg = 'INVALID_MODIFICATION_ERR'; break; case FileError.INVALID_STATE_ERR: msg = 'INVALID_STATE_ERR'; break; default: msg = 'Unknown Error'; break; }; console.log(msg); } function downloadImageAndVideo(fileEntry) { console.log('fetch image resource'); _fs.root.getFile(imagefilename, { create: true }, function (fileEntry) { var xhr = new XMLHttpRequest(); xhr.responseType = "blob"; xhr.open("GET", imagefilename, true); xhr.onload = function(e) { if (this.status == 200) { var movieBlob = this.response; fileEntry.createWriter(function (fileWriter) { fileWriter.write(movieBlob); fileWriter.onwriteend = function(e) { var src = fileEntry.toURL(); $('body').append('<h3>Image loading through Filesystem API is working (on Android Chrome!):</h3><img height="150px" src="' + src + '" />
<span id="imgInfo"></span>
'); }; }, errorHandler); } }; xhr.send(); }); console.log('fetch video resource'); _fs.root.getFile(videofilename, { create: true }, function (fileEntry) { var xhr = new XMLHttpRequest(); xhr.responseType = "blob"; xhr.open("GET", videofilename, true); xhr.onload = function(e) { if (this.status == 200) { var movieBlob = this.response; fileEntry.createWriter(function (fileWriter) { fileWriter.write(movieBlob); fileWriter.onwriteend = function(e) { var src = fileEntry.toURL(); $('body').append('<h3>Video loading through Filesystem is not working (on Android Chrome!)</h3><video controls><source src="' + src + '" type="video/webm"/></video>
<span id="videoInfo"></span>
'); }; }, errorHandler); } }; xhr.send(); }); } //request quota and persistent storage $(document).ready(function () { window.webkitStorageInfo.requestQuota( PERSISTENT, diskSpaceRequired, function (grantedBytes) { window.requestFileSystem(PERSISTENT, grantedBytes, function(fs) { _fs = fs; downloadImageAndVideo(); }, errorHandler); }, errorHandler ); }); </script> <title>foo</title> </head> <body> </body> </html>
1 回答
我已经确认此问题在最新的Android版Chrome上可以重现 .
但显然它已被修复并正在开发最新版本 . （没有更新，但这似乎是相同的错误http://crbug.com/173588）
请等待固定版本在几个月内公开 .