Thursday 15 September 2011

javascript - HTML2Canvas with CORS in S3 and CloudFront -


I have a problem and I'm totally disappointed ...: (

I'm using I am using HTML2Canvas to create a screenshot of a div with many materials.

I have read many similar questions: And, and I found another similar to my problem:

In Firefox, all are working fine, but in Chrome, I'm having problems with CORS. I have this error:

Image load from original Be done By the Cross-Origin Resource Sharing Policy: 'Access-Control-Permission-Origin' header is present on the requested resource. Therefore "Origin" is not allowed.

I configured Corrections in my S3 bucket like this:

   gt; lt; ologi ogreen & gt; * & lt; / olivegothon & gt; lt. permitted method & Gt; GET & lt; / Permission & gt; & Amp; LT; AllowedHeader & gt; * & Lt; / AllowedHeader & gt; & Lt; / CORSRule & gt; & Lt; CORSRule & gt; & Lt; AllowedOrigin & gt; Local Host & lt; / AllowedOrigin & gt; & Lt; AllowedMethod & gt; Received & lt; / AllowedMethod & gt; & Lt; AllowedHeader & gt; * & Lt; / AllowedHeader & gt; & Lt; / CORSRule & gt; & Lt; CORSRule & gt; & Lt; AllowedOrigin & gt; Local Host: 58,943 & lt; / AllowedOrigin & gt; & Lt; AllowedMethod & gt; Received & lt; / AllowedMethod & gt; & Lt; AllowedHeader & gt; * & Lt; / AllowedHeader & gt; & Lt; / CORSRule & gt; & Lt; CORSRule & gt; & Lt; AllowedOrigin & gt; Files.domain.ly & lt; / AllowedOrigin & gt; & Lt; AllowedMethod & gt; Received & lt; / AllowedMethod & gt; & Lt; AllowedHeader & gt; * & Lt; / AllowedHeader & gt; & Lt; / CORSRule & gt; & Lt; / CORSConfiguration & gt;  

files.domain.ly is the CNAME of CloudFrint.

HTML2Canvas code:

  html2canvas (document.getElementById ('zoom_container'), {useCORS: true}). (Function (canvas) {canvas.id = "image_canvas_render"; document.body.appendChild (canvas); var img = canvas.toDataURL (); Img.id = "image_render_canvas";});  

This is working on Firefox, but why not in Chrome or Safari?

Files in S3 are public and I can use a web explorer directly without any problem.

I have tried with the attribute crosorgine = "anonymous" in the IIG tag, but it is not working.

Thanks a lot !!

Edit: Sometimes this is working, and sometimes ... cash problem?


No comments:

Post a Comment