[html5] toDataURL calling itself causes security error

Philip Taylor excors+whatwg at gmail.com
Thu Jun 18 11:02:29 PDT 2009

On Thu, Jun 18, 2009 at 6:53 PM, <chris at martinilab.com> wrote:
> [...]
> var img = new Image();
> img.src = canvas.toDataURL();
> ctx.drawImage(img,0,0);
> This only works once though.  The next time I use line 2.
> img.src = canvas.toDataURL();
> I get a security error even though img is created from the same script on the server.
> [...]
> This is happening on FireFox 3, I haven't checked Safari 4 though.
> Is this working as it should?  Is it a bug?

It's a bug according to the security rules in HTML 5 (or at least it
was when I last checked), and was broken in all implementations (when
I last checked, ages ago). Sounds like
https://bugzilla.mozilla.org/show_bug.cgi?id=417836 fixes it,
presumably for Firefox 3.5, but I haven't tested that.

> Is there a better workaround than posting to the server?

Do you have to use toDataURL? e.g. could you construct a new temporary
canvas element, then draw from the current canvas onto it, then draw
back, instead of using an Image? i.e. something like

  var tmp = document.createElement('canvas');
  tmp.width = canvas.width;
  tmp.height = canvas.height;
  ctx.drawImage(tmp, 0, 0);
  tmp.getContext('2d').drawImage(canvas, 0, 0);

Philip Taylor
excors at gmail.com

More information about the Help mailing list