alphard/Comfyui-LayerForge
1
0
Fork 0
mirror of https://github.com/Azornes/Comfyui-LayerForge.git synced 2026-03-21 20:52:12 -03:00
Code Issues Packages Projects Releases Wiki Activity

Fix CORS issue for Send to Clipspace function

Browse Source 
Add crossOrigin='anonymous' attribute to image elements in CanvasLayers.ts to prevent canvas tainting. This resolves the "Tainted canvases may not be exported" error when using the Send to Clipspace feature.
This commit is contained in:
Dariusz L
2025-08-14 14:49:18 +02:00
parent d1ceb6291b
commit f6a240c535
2 changed files with 8 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
js/CanvasLayers.js
View File

@@ -96,6 +96,7 @@ export class CanvasLayers {
tempCtx.globalCompositeOperation = 'destination-in'; tempCtx.globalCompositeOperation = 'destination-in';
tempCtx.drawImage(maskCanvas, 0, 0); tempCtx.drawImage(maskCanvas, 0, 0);
const newImage = new Image(); const newImage = new Image();
newImage.crossOrigin = 'anonymous';
newImage.src = tempCanvas.toDataURL(); newImage.src = tempCanvas.toDataURL();
layer.image = newImage; layer.image = newImage;
} }
@@ -158,6 +159,7 @@ export class CanvasLayers {
reader.readAsDataURL(blob); reader.readAsDataURL(blob);
}); });
const img = new Image(); const img = new Image();
img.crossOrigin = 'anonymous';
img.onload = () => { img.onload = () => {
if (!this.canvas.node.imgs) { if (!this.canvas.node.imgs) {
this.canvas.node.imgs = []; this.canvas.node.imgs = [];
@@ -853,6 +855,7 @@ export class CanvasLayers {
} }
// Convert canvas to image // Convert canvas to image
const processedImage = new Image(); const processedImage = new Image();
processedImage.crossOrigin = 'anonymous';
processedImage.src = processedCanvas.toDataURL(); processedImage.src = processedCanvas.toDataURL();
return processedImage; return processedImage;
} }
@@ -1722,6 +1725,7 @@ export class CanvasLayers {
tempCtx.translate(-minX, -minY); tempCtx.translate(-minX, -minY);
this._drawLayers(tempCtx, this.canvas.canvasSelection.selectedLayers); this._drawLayers(tempCtx, this.canvas.canvasSelection.selectedLayers);
const fusedImage = new Image(); const fusedImage = new Image();
fusedImage.crossOrigin = 'anonymous';
fusedImage.src = tempCanvas.toDataURL(); fusedImage.src = tempCanvas.toDataURL();
await new Promise((resolve, reject) => { await new Promise((resolve, reject) => {
fusedImage.onload = resolve; fusedImage.onload = resolve;

4
src/CanvasLayers.ts
View File

@@ -100,6 +100,7 @@ export class CanvasLayers {
}); });
const img = new Image(); const img = new Image();
img.crossOrigin = 'anonymous';
img.onload = () => { img.onload = () => {
if (!this.canvas.node.imgs) { if (!this.canvas.node.imgs) {
this.canvas.node.imgs = []; this.canvas.node.imgs = [];
@@ -402,6 +403,7 @@ export class CanvasLayers {
tempCtx.drawImage(maskCanvas, 0, 0); tempCtx.drawImage(maskCanvas, 0, 0);
const newImage = new Image(); const newImage = new Image();
newImage.crossOrigin = 'anonymous';
newImage.src = tempCanvas.toDataURL(); newImage.src = tempCanvas.toDataURL();
layer.image = newImage; layer.image = newImage;
} }
@@ -1000,6 +1002,7 @@ export class CanvasLayers {
// Convert canvas to image // Convert canvas to image
const processedImage = new Image(); const processedImage = new Image();
processedImage.crossOrigin = 'anonymous';
processedImage.src = processedCanvas.toDataURL(); processedImage.src = processedCanvas.toDataURL();
return processedImage; return processedImage;
} }
@@ -2020,6 +2023,7 @@ export class CanvasLayers {
this._drawLayers(tempCtx, this.canvas.canvasSelection.selectedLayers); this._drawLayers(tempCtx, this.canvas.canvasSelection.selectedLayers);
const fusedImage = new Image(); const fusedImage = new Image();
fusedImage.crossOrigin = 'anonymous';
fusedImage.src = tempCanvas.toDataURL(); fusedImage.src = tempCanvas.toDataURL();
await new Promise((resolve, reject) => { await new Promise((resolve, reject) => {
fusedImage.onload = resolve; fusedImage.onload = resolve;