Javascript : extraire l'adresse d'un fichier

Fermé
hugs-giver Messages postés 90 Date d'inscription jeudi 27 décembre 2007 Statut Membre Dernière intervention 10 juin 2014 - 31 mars 2010 à 19:32
creadiff Messages postés 445 Date d'inscription samedi 3 avril 2010 Statut Membre Dernière intervention 3 novembre 2011 - 4 avril 2010 à 21:19
Bonsoir,
je travaille sur un formulaire, ou ont peut Uploader sont avatar.

Je voudrais ajouter une fonction qui affiche une image d'aperçue.

J'ai chercher sur le net, en général il est dit que c'est impossible car sa serait une faille de sécurité......

Mais Je sais que si je met par exemple le code suivant dans ma page :

<html>
<head>
<script language="javascript">
function fileimg()
{
var c_img = document.inscr.avatar.value;
alert(c_img);
}
</script>
</head>
<body>
<form method="post" enctype="multipart/form-data" action="/membres/inscription-submit.html" name="inscr">
<a href="javascript:fileimg()">Affiché le code</a><br>
<input name="avatar" type="file">
</form>
</body>
</html>

Le nom de l'image va s'afficher mais pas le chemin complet!

Et si par exemple je met le code suivant dans une page du site :
<img style="width: 500px; height: 375px;" alt="teste"
title="teste"
src="file:///C:/Documents%20and%20Settings/vogler/Mes%20documents/mes%20images/fete%20de%20l%27umanit%E9%202008/DSC00956.JPG">

La photo qui est dans mon pc va s'affiché, en local sur une page en ligne....

Je voudrais donc savoir si il est possible d'avoir simplement l'adresse complète vers l'image à uploader pour pouvoir l'afficher en local sur la page de mon site!

Voici l'adresse vers le formulaire :
http://ramenetagueule.com/membres/inscription.html




Ps, ce n'est pas safari mais google chrome

1 réponse

creadiff Messages postés 445 Date d'inscription samedi 3 avril 2010 Statut Membre Dernière intervention 3 novembre 2011 57
3 avril 2010 à 11:04
Il y a un moyen... plus compliqué, en utilisant du JavaScript, un iframe et de l'AJAX. Est-ce vraiment nécessaire ?
0
Zestyr Messages postés 466 Date d'inscription mercredi 12 août 2009 Statut Membre Dernière intervention 17 octobre 2011 52
3 avril 2010 à 14:53
Affirmatif:
<input type="file" /> + XHRObject + PHP
et c'est parti !
0
hugs-giver Messages postés 90 Date d'inscription jeudi 27 décembre 2007 Statut Membre Dernière intervention 10 juin 2014 30
Modifié par hugs-giver le 4/04/2010 à 18:53
Non, ce n'est pas nécessaire, mais bon, après, mon site non plus ne l'est pas...

Dis-ont que ça fait mieux et sa m'apprend d'autres truc.

Merci Zestyr, je n'est rien compris, mais je vais faire des recherches a partir de ta réponse, et si je trouve rien, je verrai du coté de l'ajax même si c'est un langage que je ne connais pas du tout!:)

Merci
0
creadiff Messages postés 445 Date d'inscription samedi 3 avril 2010 Statut Membre Dernière intervention 3 novembre 2011 57
Modifié par creadiff le 4/04/2010 à 21:24
L'objet XHR ne permet pas l'envoi de fichiers...

La méthode la plus simple et la plus efficace consiste à inclure le bouton "télécharger..." (l'input de type file) dans un iframe, contenant une page en PHP, et que sur cette page en PHP, un événement JavaScript déclenche la soumission du formulaire.
La page à laquelle est envoyée le formulaire sera chargée de sauvegarder puis d'afficher l'image téléchargée.


inscription.php
...
<iframe src="cadre.php"></iframe>
...
<form action="enregistrement.php" action="post" enctype="application/x-www-form-urlencoded">
...
<input type="hidden" id="url_pic" name="url_pic" />
...
</form>
...

cadre.php
<form action="enregistreetafficheimage.php" enctype="multipart/form-data" name="form_pic">
      <input type="file" onchange="document.form_pic.submit()" />
</form>


enregistreetafficheimage.php
Cette page doit:
1- en PHP: sauvegarder le fichier, et l'afficher grâce à une balise img
2- en JavaScript: donner l'URL de l'image au formulaire d'inscription... pour ça,
parent.document.getElementById('url_pic').value = $url_de_l_image_enregistree;
0