CODEWITHSUNDEEP
javascriptgoogle-chromecanvascross-domain
byteherder
byteherder

Reputation: 331

HTML5 Video in Chome, SECURITY_ERR: DOM Exception 18

I am trying to have my webpage display a video from my video server. The video server is running on the same host as my webserver, but on a different port.

When I use canvas.toDataURL() to scrape the pixels off the video that is playing on the canvas, I am getting a "Uncaught Error: SECURITY_ERR: DOM Exception 18" on the browser. I am using Chrome, version 24.

Here is the HTTP header sent with the video page

HTTP/1.1 200 OK
Access-Control-Allow-Origin: *
Content-Type: video/x-mp4
Transfer-Encoding: chunked
Date: Mon, 04 Feb 2013 23:28:00 GMT
Server: OizysLight

What am I missing? Shouldn't the "Access-Control-Allow-Origin: *" allow cross origin resource sharing?

Upvotes: 0

Views: 1217

Answers (2)

byteherder
byteherder

Reputation: 331

I found the answer. I needed to set the crossOrigin property on my video.

video.crossOrigin = "Anonymous";

Upvotes: 0

apsillers
apsillers

Reputation: 115940

You probably need to set the crossOrigin property on the <video> element. You can set it to anonymous if the request for the video resource doesn't need cookies or HTTP auth, or use-credentials otherwise.

Mozilla has a writeup about cross-domain images on a <canvas>, and virtually all of it also applies to videos.

Upvotes: 2

Related Questions