Mapped color transformation on cors tainted image

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP


Mapped color transformation on cors tainted image



I need to transform colors in an image obtained from an s3 server which disallows crossOrigin.



This is the functionality I need:


const img = new Image();
img.src = src;
ctx.drawImage(img, 0, 0);
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
const colors = [25,50,100,255];
const data = imageData.data;
for (let i = 0; i < data.length; i += 4) {
if(data[i] == 1){data[i] = colors[1]}
if(data[i] == 2){data[i] = colors[2]}
if(data[i] == 3){data[i] = colors[3]}
}



but got tainted by crossOrigin error:



enter image description here



I know I can not use getImageData in this case. I don't want to read the image data.


getImageData



But maybe complete my task through some other webGL / canvas operation?



Rendering on a server or proxying is not possible.





Possible duplicate of How to fix getImageData() error The canvas has been tainted by cross-origin data?
– NullPointer
12 mins ago





@NullPointer I am not asking to use getImageData ( not possible ), but to make the same transformation using a canvas / webgl api
– Skarlinski
10 mins ago









By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Popular posts from this blog

C# - How to create a semi transparent or blurred backcolor on windows form

Swipe gestures in WKWebView

How to populate data on nav-tab in partial View in MVC?