0

I'm trying to get the image of Map from OpenLayers 4.6.5 and the following error is appearing each and every time.

I'm using cdn link of OpenLayers 4.6.5 for the base Map in JavaScript with Apache Tomcat server in web application (HTTP format) everything is working fine.

But when I start to get the image from OpenLayers Map it's giving :

SecurityError: The operation is insecure.

in case of FireFox and

Uncaught DOMException: Failed to execute 'toBlob' on 'HTMLCanvasElement': Tainted canvases may not be exported.

It's really head eating and I have tried many ways like CORS, timeout and anything available from other sources:

   canvas.toBlob(function(blob)
            {  

             var imgData = new Image();
             imgData.setAttribute('crossOrigin', 'anonymous');
             imgData.src = canvas.toDataURL('png');
           }

I found out something like (I'm not sure) : it's due to security of the network i.e I'm using secure cdn link from OpenLayers :

https://cdnjs.cloudflare.com/ajax/libs/openlayers/4.6.5/ol.js

which is https:// and my application is http:// ---- is this a problem? I'm really tired of this.

Could anyone look into it?

0

Tainted canvas happens, when you load some CORS insecure third-party (cross-domain) image into your map (canvas). It is not related to scripts or timeouts. It is a security behavior from your browser, which disable downloading of the tainted image (possible security threat). Check all your map sources, to avoid having tainted canvas the source must be CORS compliant. If the source is not on your domain, it must have access-control-allow-origin header set to your domain or to *. Also your source should have parameter crossOrigin set to Anonymous for example like this:

source: new ol.source.TileWMS({
            crossOrigin: "anonymous",...

More information here and here:

  • Thank you so much!!! it solved. – Ranjith Kumar Rama Jun 21 at 8:14
  • this solves by adding crossOrigin: "anonymous", in Base Map layer source – Ranjith Kumar Rama Jun 21 at 8:15
  • You can mark the answer as accepted if you will – Catch Jun 21 at 11:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.