Persistant CORs error while using cropper

[rhysstubbs]

I have a web app fetching images cross-origin. The server that is serving those images is configured to allow cross-origin requests and I can see the images in various places. However, when I try and load that image using the cropper I suddenly get failed CORs requests.

In the source I can see you're checking if the image src URL is cross origin, and if so then setting the anonymous flag for the canvas so it isn't in "taint" mode. Before I jump any further into the source looking for the problem, is this expected/a known issue?

[Norserium]

@alexfauquette try to update to 1.4.0. The example. Notice, that for your case you should disable the checking of an image orientation also.

[alexfauquette]

It works perfectly :)

[Norserium]

I assume that after all this issue can be closed. The browser behavior that causes this issue is explained in the documentation section.

[Getz85]

Hi @Norserium,

I still have issue with CORS on vue-advanced-cropper@next (2.7.0) for vuejs 3, with or without canvas set to false.

I use the same image that the exemple above:

<cropper src="http://static.openfoodfacts.org/images/products/842/314/800/0015/nutrition_es.3.400.jpg"
         class="responsive photo"
         :check-orientation="false"
         :canvas="false"
         @change="onChange"
/>

And in the console:

Access to image at 'http://static.openfoodfacts.org/images/products/842/314/800/0015/nutrition_es.3.400.jpg' from origin 'http://localhost' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

If I inspect the DOM of the cropper and remove the attribute "crossorigin" (which is set to false without canvas and anonymous with canvas) of the img tag, the image is displayed.

Is it a bug that was fixed on 1.4.0 and not reported on the next branch ?

[Norserium]

@Getz85, thank you for your report. Conditional rendering of attributes changed in Vue 3 (official information, example), and I forgot to adapt the code to this changes.

I've fixed it in 2.7.1 now.

[Getz85]

@Norserium I confirm that the problem is solved, thank you for your reactivity and thanks for this awesome module !

[Norserium]

@Getz85, you are welcome!