Discussion :

[Maestro64]

Bonjour à tous,

Voilà je suis bloqué sur un problème depuis plusieurs jours, et malgré tout ce qu'il y a sur Google, je n'arrive pas à le régler.
Mon problème est le suivant : J'ai un canvas, dans lequel je coupe des images en deux, pour les recoller et en faire de nouvelles (c'est un jeux pour enfant), et j'aimerais pouvoir sauvegarder la nouvelle image (donc composée de deux moitié d'images différentes).

Voilà mon code qui dessine mes images :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
var ctx;
draw = function() {
	ctx = document.getElementById("canvas").getContext('2d');
	img.onload = function() {
		if( ciseaux == "V" ) {
			ctx.drawImage(img, 0, 0, 200, 400, 0, 0, 200, 400);
			ctx.drawImage(img2, 200, 0, 200, 400, 200 + espace, 0, 200, 400);
		}
		else {
			ctx.drawImage(img, 0, 0, 400, 200, 0, 0, 400, 200);	
			ctx.drawImage(img2, 0, 200, 400, 200, 0, 200 + espace, 400, 200);			
		}
	};
	img2.onload = function() {
		if( ciseaux == "V" ) {
			ctx.drawImage(img, 0, 0, 200, 400, 0, 0, 200, 400);
			ctx.drawImage(img2, 200, 0, 200, 400, 200 + espace, 0, 200, 400);
		}
		else {
			ctx.drawImage(img, 0, 0, 400, 200, 0, 0, 400, 200);	
			ctx.drawImage(img2, 0, 200, 400, 200, 0, 200 + espace, 400, 200);			
		}
	};
};

Et quand j'appelle ce morceau de code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
var canvas  = document.getElementById("canvas");
var dataUrl = canvas.toDataURL("image/jpeg");
console.log(dataUrl);

Il me retourne une erreur de sécurité, qui est celle-ci :

Uncaught SecurityError: Failed to execute 'toDataURL' on 'HTMLCanvasElement': tainted canvases may not be exported.

Vous remerciant d'avance.
Cordialement.

[Invité]

si les testes sont fait en local sa peut etre la cause il faudrait tester avec firefox qui n'a pas cette restriction

[Maestro64]

Tout est fait en local, le client du projet veux ce jeux en mode déconnecté, sans aucuns accès internet. Du coup nous avons tout développé en WebSQL, via Javascript. Seulement Chrome et Safari supporte WebSQL, pas firefox donc on l'a abandonné.

Je pense que c'est là que réside le problème, mais est-ce qu'il y aurait de récupérer l'image du canvas malgré ceci ?

[SpaceFrog]

installer un serveur en local ?

[Maestro64]

L'application devra être utilisable sous ordinateur, tablette Android et IOS.
Ca reste envisageable ?

De plus elle doit être utilisable simplement, donc on aimerait que le client n'ait pas à installer WAMP ou un autre, puis copier les fichiers dedans, pour pouvoir le lancer.

[SpaceFrog]

non il faudra du coup faire appel à un service web hebergé sur un serveur qui retournera le fichier en forcedownload ...