The My Opera forums have been replaced with forums.opera.com. Please head over there to discuss Opera's products and features

See the new Forums

'Security violation' problem when using canvas.toDataURL() to get a video frame data

Forums » Dev.Opera » General Web Development Discussions

You need to be logged in to post in the forums. If you do not have an account, please sign up first.

Go to last post

17. November 2011, 07:02:28

loliod

Posts: 1

'Security violation' problem when using canvas.toDataURL() to get a video frame data

Hi all,
I want to test the webcam feature in Opera (Opera desktop for Windows, http://labs.opera.com/news/2011/10/19/) and i tried to get the video frame data, so i can save it in local storage, but i meet a 'Security violation' problem when using canvas.toDataURL(). How can i get the camera frame data, thanks for your advice:)

The JS code as bellow:

var scaleFactor = 0.30;
var video = document.getElementsByTagName('video')[0],
heading = document.getElementsByTagName('h1')[0];

if(navigator.getUserMedia) {
navigator.getUserMedia('video', successCallback, errorCallback);
function successCallback( stream ) {
video.src = stream;
}
function errorCallback( error ) {
heading.textContent =
"An error occurred: [CODE " + error.code + "]";
}
} else {
heading.textContent =
"Native web camera streaming is not supported in this browser!";
}


function capture(video, scaleFactor) {
if(scaleFactor == null){
scaleFactor = 1;
}
var w = Math.floor(video.videoWidth * scaleFactor);
var h = Math.floor(video.videoHeight * scaleFactor);
var canvas = document.createElement('canvas');
canvas.width = w;
canvas.height = h;

var ctx = canvas.getContext('2d');
ctx.drawImage(video, 0, 0, w, h);

//for test
var canvas_test = document.getElementById('myCanvas');
var ctx_test = canvas_test.getContext('2d');
ctx_test.drawImage(video, 0, 0, canvas_test.width, canvas_test.height);

var frameData = canvas_test.toDataURL('image/png'); //Uncaught exception: ReferenceError: Security violation

//.....

return canvas;
}

function shoot(){
var canvas = capture(video, scaleFactor);
}




29. November 2011, 21:11:24

malizor

Posts: 1

I get the same error.
Any clue on this?

22. December 2011, 07:14:51

little7

Posts: 2

got the same error.
I searched a lot, only some clue about image, but not solution to this problem.
http://blog.chromium.org/2011/07/using-cross-domain-images-in-webgl-and.html

22. December 2011, 15:53:43

ramkira

Posts: 1

They tried this:

  • Type in about:config into the address bar

  • Go to Security Prefs and tick ”Allow Camera To Canvas Copy”


That should work.coffee

23. December 2011, 08:40:19

little7

Posts: 2

This DID work. Thank you!

Originally posted by ramkira:

They tried this:

  • Type in about:config into the address bar

  • Go to Security Prefs and tick ”Allow Camera To Canvas Copy”


That should work.coffee

Forums » Dev.Opera » General Web Development Discussions