Getting "Not allowed to load local resource" error while trying to attach a MediaSource object as the source of a HTML5 video tag

javascript html html5-video media-source
Mathew picture Mathew · Jul 16, 2013 · Viewed 29.8k times · Source

I am trying to get this example to work. It works fine when I click the link. But when I try to download the HTML file on my local machine and try the same, it is throwing this error.

Not allowed to load local resource: blob:null/6771f68d-c4b8-49a1-8352-f2c277ddfbd4

The line of code that seems to be causing the issue is this,

video.src = window.URL.createObjectURL(mediaSource);

What this line of code is doing is basically trying to set the source of the video tag media element to the MediaSource object. I have tried various permutations without much luck.

I am using Chrome Version 28.0.1500.72 m, which is the latest stable release.

I would appreciate any pointers.

Answer

Filipe Merker picture Filipe Merker · Oct 1, 2015

As @dandavis has said, "run it from http: not file".

I'm posting this as an answer for the sake of organization.

For starters: Running you project from http means having a http server (such as apache or a simple node http-server) and running your project via http://localhost.

Related questions

Prevent HTML5 video from being downloaded (right-click saved)?

How can I disable "Save Video As..." from a browser's right-click menu to prevent clients from downloading a video? Are there more complete solutions that prevent the client from accessing a file path directly?

Read More
Detect if HTML5 Video element is playing

I've looked through a couple of questions to find out if an HTML5 element is playing, but can't find the answer. I've looked at the W3 documentation and it has an event named "playing" but I can't seem to get …

Read More
How to change the playing speed of videos in HTML5?

How to change the video play speed in HTML5? I've checked video tag's attributes in w3school but couldn't approach that.Any help would be appreciated!

Read More