2

When I try to stream a video from a url, I get the following error:

Uncaught (in promise) DOMException: Failed to load because no supported source was found.

Obviously, I've tested and my source works great. Here's a simplified JS fiddle, and here's a copy of the code in that fiddle:

// Create HTML Video Element to play the video
var video = document.createElement('video');
video.addEventListener('loadeddata', function (e) {
    document.body.appendChild( video );
});

video.src = 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4';
video.crossOrigin = 'anonymous';
video.loop = true;
video.play();

What do I need to change in order to get it working?

Pete
  • 7,289
  • 10
  • 39
  • 63
  • run from http (not https) and remove the `video.crossOrigin = 'anonymous';` part – dandavis Apr 25 '17 at 19:16
  • Thanks! It's already http :-), but why wouldn't https work? Also, it is being loaded cross-origin, right? So why do I need to remove that? – Pete Apr 25 '17 at 19:19
  • you can view http resources from an https page. TBH, I don't know why removing the cross-origin stuff fixed the fiddle (i'm about to look that up), but it did... – dandavis Apr 25 '17 at 19:20
  • the `crossOrigin` is only needed when using an off-site authenticated resource. – dandavis Apr 25 '17 at 19:22
  • Okay sooo...what if I'm on an HTTPS domain and *need* to use an https video url? Then I'd need crossOrigin, right? – Pete Apr 25 '17 at 19:23
  • no, if you're all-https you don't need anything. crossOrigin is for preventing basic authentication credentials leaking, which is not a common situation anyway... – dandavis Apr 25 '17 at 19:25
  • here's an updated fiddle for ya https://jsfiddle.net/RachGal/rLxytsmm/ – Rachel Gallen Apr 25 '17 at 19:27
  • you should read this though https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise/then and this other answer http://stackoverflow.com/a/37628027/1675954 – Rachel Gallen Apr 25 '17 at 19:29
  • @RachelGallen, your updated example fails and shows `Uncaught (in promise) NotSupportedError: Failed to load because no supported source was found.` in the console. – Pete Apr 25 '17 at 19:35
  • @Pete it runs on my machine.. i only commented out the cross-origin line. Actually i changed it to https also – Rachel Gallen Apr 25 '17 at 19:36

0 Answers0