2

I am loading in images from a server on a different domain. The images are CORS-enabled (they have this header: Access-Control-Allow-Origin: *). In modern browsers, using image.crossOrigin = '', I am able to safely draw them to a <canvas>.

I would like to also be able to do the same on Internet Explorer 9. IE9 does not support crossOrigin on images. It does have XDomainRequest for cross-domain requests using the Access-Control-Allow-Origin header.

Is it possible to load a PNG via XDomainRequest and draw it to a canvas?

sideshowbarker
  • 81,827
  • 26
  • 193
  • 197
Simon Cave
  • 3,971
  • 4
  • 24
  • 28

1 Answers1

2

Complications of Downloading images with XDomainRequest in IE

IE only allows XdomainRequest to work with plain-text data (ARGH!!): http://blogs.msdn.com/b/ieinternals/archive/2010/05/13/xdomainrequest-restrictions-limitations-and-workarounds.aspx

IE will also sniff all incoming data using its FindMimeFromData. So even if you strip off the url's type prefix (data:image/png;base64), this sniffer will realize that your base64 text is really an image and treat it accordingly: http://msdn.microsoft.com/en-us/library/ms775147(v=vs.85).aspx

A possible try would be to re-encode the base64 text somehow to confuse the sniffer.

MS apparently realizes that their CORS policy is too restrictive and is planning on adding expanded CORS support to their webAPI: http://channel9.msdn.com/Shows/Web+Camps+TV/ASPNET-Web-API-and-CORS-Support

Otherwise you’re left with the current solution of bouncing images off your own web server so that they’re not X-domain anymore.

markE
  • 102,905
  • 11
  • 164
  • 176