4

在通过 <input> 使用 createObjectURL() 将 <video> 的 src 设置为本地视频文件以生成文件路径时,是否有人遇到过 Internet Explorer 10 的问题?

错误:Internet Explorer 10 给出错误“无效源”。

示例:我有一个简单的 html 示例,它适用于 Chrome v27 和 Firefox v21,但不适用于 Internet Explorer v10。

当前解决方法:将域添加到 IE 10 受信任站点,然后引用 <input> 的“值”(包括我的示例)。但毫无疑问,window.URL.createObjectURL() 功能旨在避免这种解决方法。奇怪的是,<sound> 和 <img> 元素在 IE 10 中使用 createObjectURL() 可以正常工作。

有什么想法吗?我错过了什么吗?

提前致谢。

    <!DOCTYPE html>
    <html>
        <head>
            <title>Internet Explorer 10 : HTML5 Video.Src : 'Invalid Source' error when setting local file as source using createObjectURL()</title>
        </head>
        <body>

            <input type="file" id="filesInputVideo" name="files[]" onchange="handleVideoFileBrowse(event.target)" /> <br />
            <video id="videoElement" width="350" style="border-style: solid" controls></video>

            <script type="text/javascript">

                var createObjectURL = (window.URL && URL.createObjectURL.bind(URL)) ||
                                      (window.webkitURL && webkitURL.createObjectURL.bind(webkitURL)) || 
                                      window.createObjectURL;

                function handleVideoFileBrowse(target) 
                {
                    var url = createObjectURL(target.files[0]); // Works in Chrome v27 and Firefox v21, but NOT in Internet Explorer v10.0.9200

                    //url = target.value; // My temporary workaround for IE 10, but only works if the domain has been added as Trusted in IE: Internet Options - Security - Trusted sites.

                    document.getElementById("videoElement").src = url;
                }
            </script>

        </body>
    </html>
4

0 回答 0