Invalid source when configuring HTML5 Video.Src in IE10 using <Input> file with createObjectURL ()

Has anyone had this problem with Internet Explorer 10 when setting up src <video> to a local video file via <input> using createObjectURL () to generate the file path?

Error: Internet Explorer 10 gives the error "Invalid source."

Sample: I have a simple html example that works in Chrome v27 and Firefox v21, but NOT in Internet Explorer v10.

Current workaround: add a domain in IE 10 Trusted Sites, then specify a <input> value (included my example). But, of course, the window.URL.createObjectURL () function is designed to prevent this workaround. Oddly enough, the <sound> and <img> elements work fine in IE 10 using createObjectURL ().

Any ideas guys? Did I miss something?

Thanks in advance.

<!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
source share

Source: https://habr.com/ru/post/1485346/


All Articles