balise <input type='file'> et paramètre [Résolu]

Luke spywoker · 16/09/2011, 08h38

Bonjour,
J'ai passer la moitié de la nuit a essayer de coder un affichage d'image dès le choix du fichier mais il s'avère que la propriété value de la balise <input type='file'> est recu par mon programme traitant l'image comme un string et non comme un fichier (ou chemin de fichier).
Je code coté serveur en python avec le Framework cherrypy et je me suis fortement inspiré de ce code: http://docs.cherrypy.org/stable/prog...uploading.html
Et il semblerai que le problème est de transmettre le paramètre: le fichier image en mode POST ce qui ne marche pas comme ça:

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
25
26
 
<!DOCTYPE html>
<html lang='fr'>
<head>
<meta charset='utf-8'>
<script> 
function updateImage() {
  if (window.XMLHttpRequest) {
    var conn=XMLHttpRequest();
    conn.open("POST", "http//lurl/vers/mon/fichier/de /traitement", false); // ou en GET conn.open("GET", "http//lurl/vers/mon/fichier/de/traitement"+"?file_name="+document.forms['formulaire'].elements['image'].value, false)   
    conn.send("file_name="+document.forms['formulaire'].elements['image'].value);// Avec GET: conn.send(null)
    if (conn.readyState == 4) {
      document.images['img'].src=conn.responseText;
      }
   }
}
 
</script>
</head>
<body>
<img name='img' src=''>
<form name='formulaire' method='POST' enctype='multipart/form-data'>
<input type='file' name='image' onchange="updateImage()">
</form>
</body>
</html>

Resultat avec la methode GET l'argument recu par mon script de traitement est de type string ce qui ne convient pas au traitement (téléchargement et retaillage):il faudrait que sa soit l'objet image afin que je puisse le traiter.
Avec la méthode POST l'argument n'est pas transmis a mon scripte ce qui provoque une érreur j'aurai une érreur de code avec la méthode POST ?
Coté serveur: l'image serai retailler et déplacer pour finir comme valeur de l'attribut src de la balise <img> comme vous l'avez déja compris.
Si quequ'un pourrait m'aider sa serai sympa.
merci

F0ul · 20/09/2011, 00h37

Il faut d'abord que tu obtiennes ton image.
En lisant la valeur de ton "input", tu ne lis que le chemin vers l'image. Il faut d'abord que tu crées une copie de l'image pour pouvoir la transmettre au traitement... ou bien la copier sur ton serveur et appeler ton traitement.

Luke spywoker · 20/09/2011, 10h17

C'est le problème car comme mentionner dans le lien vers le code du framework que j'utilise il suffit de d'écrire le paramètre sur la disque pour avoir le fichier image ce qu'est censer faire la requète XMLHttpRequest() (c'est ce que est censer faire "http//lurl/vers/mon/fichier/de /traitement") et comme javascript ne permet pas d'écrire sur le disque avant cette requète je suis bloquer car je n'ai que le nom de l'image de type string a transmettre comme paramètre. Le Framework est basé sur un module cgi qui permet d'avoir l'objet image comme paramètre.
Je pense que ce que j'essaie de faire n'est pas possible avec les moyens que j'ai tout simplement.

F0ul · 21/09/2011, 18h17

Il suffit de passer par un script qui fera l'intermédiaire ...
Formulaire --> Création de l'image --> Traitement

Luke spywoker · 21/09/2011, 19h56

Comment ca un script, dans l'esprit d'Ajax qui est de ne pas changer de page pour un traitement synchrone ou asynchrone d'un élément, si je ne dispose pas de l'objet image comme paramètre je ne peut faire de création d'image. Ajax appel un fichier(ou script) afin de traiter la requète XMLHttpRequest et dans mon formulaire le fichier (ou script) appeler ne peut marcher car l'argument transmis n'est pas l'objet cgi image mais le nom du fichier a uploader et donc mon script ne marche pas.
A... je comprend tu pense qu'en créant un objet image javascript sa va passer, j'ai pas trop creuser par la mais j'ai eu cette idée aussi et sa n'a pas marcher du a mon manque d'expérience du javascript.
Pourrait tu developper ton idée, sa serai sympa:
Formulaire --> Création de l'image --> Traitement
(surtout création de l'image)
Merci pour ton idée.

Bovino · 26/09/2011, 11h08

Tu ne peux pas transférer d'images via AJAX.
La solution souvent utilisée est de passer par un iframe qui contient l'input file que tu pourras soumettre sans recharger l'ensemble de la page.

Luke spywoker · 27/09/2011, 20h01

C'est bien ce que je pensais c.a.d que ce que j'essayai de faire n'est pas possible.

20/09/2011, 10h17	#3
Luke spywoker Membre confirmé Etudiant informatique autodidacte Inscription : juin 2010 Messages : 452 Détails du profil Informations personnelles : Sexe : Localisation : France Informations professionnelles : Activité : Etudiant informatique autodidacte Informations forums : Inscription : juin 2010 Messages : 452 Points : 278 Points : 278	C'est le problème car comme mentionner dans le lien vers le code du framework que j'utilise il suffit de d'écrire le paramètre sur la disque pour avoir le fichier image ce qu'est censer faire la requète XMLHttpRequest() (c'est ce que est censer faire "http//lurl/vers/mon/fichier/de /traitement") et comme javascript ne permet pas d'écrire sur le disque avant cette requète je suis bloquer car je n'ai que le nom de l'image de type string a transmettre comme paramètre. Le Framework est basé sur un module cgi qui permet d'avoir l'objet image comme paramètre. Je pense que ce que j'essaie de faire n'est pas possible avec les moyens que j'ai tout simplement. __________________ Pour faire tes armes: Use du présent pour construire ton futur sinon use de ce que tu as appris auparavant. Et sois toujours bien armé avant de te lancer. Le hasard ne sourit qu'aux gens préparés... Blog: http://3dcyberspace.unblog.fr/ Site: Sanctuaire cybernétique
	00

21/09/2011, 19h56	#5
Luke spywoker Membre confirmé Etudiant informatique autodidacte Inscription : juin 2010 Messages : 452 Détails du profil Informations personnelles : Sexe : Localisation : France Informations professionnelles : Activité : Etudiant informatique autodidacte Informations forums : Inscription : juin 2010 Messages : 452 Points : 278 Points : 278	Comment ca un script, dans l'esprit d'Ajax qui est de ne pas changer de page pour un traitement synchrone ou asynchrone d'un élément, si je ne dispose pas de l'objet image comme paramètre je ne peut faire de création d'image. Ajax appel un fichier(ou script) afin de traiter la requète XMLHttpRequest et dans mon formulaire le fichier (ou script) appeler ne peut marcher car l'argument transmis n'est pas l'objet cgi image mais le nom du fichier a uploader et donc mon script ne marche pas. A... je comprend tu pense qu'en créant un objet image javascript sa va passer, j'ai pas trop creuser par la mais j'ai eu cette idée aussi et sa n'a pas marcher du a mon manque d'expérience du javascript. Pourrait tu developper ton idée, sa serai sympa: Formulaire --> Création de l'image --> Traitement (surtout création de l'image) Merci pour ton idée. __________________ Pour faire tes armes: Use du présent pour construire ton futur sinon use de ce que tu as appris auparavant. Et sois toujours bien armé avant de te lancer. Le hasard ne sourit qu'aux gens préparés... Blog: http://3dcyberspace.unblog.fr/ Site: Sanctuaire cybernétique
	00

26/09/2011, 11h08	#6
Bovino Responsable Développement Web Didier Mouronval Développeur Web Inscription : juin 2008 Messages : 13 807 Détails du profil Informations personnelles : Nom : Didier Mouronval Âge : 41 Localisation : France, Gironde (Aquitaine) Informations professionnelles : Activité : Développeur Web Secteur : High Tech - Éditeur de logiciels Informations forums : Inscription : juin 2008 Messages : 13 807 Points : 35 789 Points : 35 789	Tu ne peux pas transférer d'images via AJAX. La solution souvent utilisée est de passer par un iframe qui contient l'input file que tu pourras soumettre sans recharger l'ensemble de la page. __________________ Pas de question technique par MP ! Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi ! Vous possédez un blog et aimeriez diffuser vos billets sur le forum, contactez-moi ! Mes formations video2brain : La formation complète sur JavaScript • JavaScript et le DOM par la pratique • PHP 5 et MySQL : les fondamentaux Mon livre sur jQuery
	00

27/09/2011, 20h01	#7
Luke spywoker Membre confirmé Etudiant informatique autodidacte Inscription : juin 2010 Messages : 452 Détails du profil Informations personnelles : Sexe : Localisation : France Informations professionnelles : Activité : Etudiant informatique autodidacte Informations forums : Inscription : juin 2010 Messages : 452 Points : 278 Points : 278	C'est bien ce que je pensais c.a.d que ce que j'essayai de faire n'est pas possible. __________________ Pour faire tes armes: Use du présent pour construire ton futur sinon use de ce que tu as appris auparavant. Et sois toujours bien armé avant de te lancer. Le hasard ne sourit qu'aux gens préparés... Blog: http://3dcyberspace.unblog.fr/ Site: Sanctuaire cybernétique
	00

20/09/2011, 00h37	#2
F0ul Membre du Club Guillaume Lauer Ingénieur systèmes embarqués Inscription : janvier 2006 Messages : 81 Détails du profil Informations personnelles : Nom : Guillaume Lauer Âge : 25 Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur) Informations professionnelles : Activité : Ingénieur systèmes embarqués Secteur : High Tech - Électronique et micro-électronique Informations forums : Inscription : janvier 2006 Messages : 81 Points : 57 Points : 57	Il faut d'abord que tu obtiennes ton image. En lisant la valeur de ton "input", tu ne lis que le chemin vers l'image. Il faut d'abord que tu crées une copie de l'image pour pouvoir la transmettre au traitement... ou bien la copier sur ton serveur et appeler ton traitement.
	00

21/09/2011, 18h17	#4
F0ul Membre du Club Guillaume Lauer Ingénieur systèmes embarqués Inscription : janvier 2006 Messages : 81 Détails du profil Informations personnelles : Nom : Guillaume Lauer Âge : 25 Localisation : France, Alpes Maritimes (Provence Alpes Côte d'Azur) Informations professionnelles : Activité : Ingénieur systèmes embarqués Secteur : High Tech - Électronique et micro-électronique Informations forums : Inscription : janvier 2006 Messages : 81 Points : 57 Points : 57	Il suffit de passer par un script qui fera l'intermédiaire ... Formulaire --> Création de l'image --> Traitement
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email