Discussion :

[zanteskuken]

Bonjour à tous.


Un petit souci qui ne devrai être trop gros je pense au final.

Envoyer une liste de fichier sélectionné, à travers javascript, à Php.

J'aimerai Réceptionner le type "FormData" de javascript, envoyer par XmlHttpRequest.

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
11
12
var data = new FormData();
	for(var i=0, len=fileAll.length; i<len; i++) {
		data.append("filesToUpload", fileAll[i]);	
	}
	var xhr = getXMLHttpRequest(); //Créé xhr si possible
	xhr.open("POST", "{{ path('updatePicksSendF') }}", true);
	xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	//xhr.send("fileA="+fileA+"&nameF="+nameF+"&data="+data);
	xhr.send(data);
	xhr.onload = function() {
        alert('Upload terminé !');
};

Où fileAll est la liste des fichiers ajoutés.

Code html :

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

<input type="file" id="fileInput" name="fichier[]" multiple accept="image/*">

Code javascript :

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
var fileAll = new Array();
document.getElementById('fileInput').addEventListener( 'change', getFiles, false );
function getFiles(evt)
{
    var files = evt.target.files;
 
    // On parcourt la liste des fichiers sélectionnées
    for( var i = 0; i < files.length; i++ )
    {
    	imgType = files[i].name.split('.');
        imgType = imgType[imgType.length - 1].toLowerCase(); // On utilise toLowerCase() pour éviter les extensions en majuscules
 
        if(allowedTypes.indexOf(imgType) != -1) 
        {
 
        fileAll.push(files[i]);
 
//etc...

La réception coté PHP

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
updatePicksSendFAction ()
{
if(!empty($_POST))
{
	// On verifie si le champ est rempli
	//$objILOC = json_decode(stripslashes($_POST['fileA']));
	$objILOC = $_FILES['filesToUpload'];
	for ($i=0; $i<count($objILOC); $i++)
	{
		$logger->info('UpdateAccountController - updatePicksSendF files : '.$objILOC[$i]['name']);
	}
// etc..

Erreur :

updatePicksSendF : exception 'ErrorException' with message 'Notice: Undefined index: filesToUpload

Je reçois bien quelque chose, en autre une envoi POST, mais la variable/objet "filesToUplaod" n'est pas reconnu.

Qu'est ce que j'ai oublié ?

Merci

[Bovino]

Code javascript :

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

xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

Pour des fichiers, il faut que le Content-Type soit multipart/form-data.

[zanteskuken]

Oh oui tu as raison, Merci de cette remarque. J'avais lu ça dans un tutorial et j'ai oublié de le spécifier.

En revanche le problème n'est pas résolu et je trouve quelques éléments étranges.

Explication :

Le code avec xhr :

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
var fileData = new FormData();
	for(var i=0, len=fileAll.length; i<len; i++) {
               //fileAll est la liste de fichiers => fileAll.push(files[i]);
		fileData.append("filesToUpload[]", fileAll[i]);	
	}
var xhr = getXMLHttpRequest();
	var serv = Routing.generate('updatePicksSendF');
	 xhr.open('POST', serv, true);
	xhr.setRequestHeader("Content-Type", "multipart/form-data");
	xhr.send(fileData);

La requête est bien envoyé à Php mais celui-ci me dis que la variable $_POST est vide. (le problème initiale).

J'essaye avec un envoie Ajax comme suit :

Code javascript :

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
var fileData = new FormData();
for(var i=0, len=fileAll.length; i<len; i++) {
	fileData.append("filesToUpload[]", fileAll[i]);	
}
$.ajax({
	  url: Routing.generate('updatePicksSendF'),
	  type:'POST',
	  data: fileData,
	  processData: false,  // tell jQuery not to process the data
	  contentType: false,   // tell jQuery not to set contentType
	  dataType: 'json'
})
  .done(function(json) {
    var inf = json.info;
    if(inf == "")
	{
		alert(json.message); 
	}
  })
.fail(function(json){
	//json = JSON.parse(json);
	alert(json.info+" -- "+json.message);
	var inf = json.result;
  	alert('Erreur: '+inf);
  });

Même résultat.

HORS !!!!

si je rajoute cette ligne :

Code javascript :

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

1
2
3
4
5
var fileData = new FormData();
for(var i=0, len=fileAll.length; i<len; i++) {
	fileData.append("filesToUpload[]", fileAll[i]);	
}
fileData.append("kk","kk");

J'ajoute n'importe quoi en gros.

Je reçois bien mes fichiers sélectionnés.

Je reste incompris. Qu'est ce qui se passe ?

Erreur de structure "FormData" ? i.e. ?

ce "bidouillage" ne fonctionne pas avec xhr.

Du coup je me pose deux question.

- 1 : J'ai vu plusieurs tutos pour envoyer un formdata via xhr et c'est toujours la même syntaxe, donc je ne comprends pas en quoi la mienne est fausse.

- 2 : Pourquoi rajouter un champs "hasardeux" à FormData pour qu'il puisse être "Lisible" par PHP ?

Je ne saisis pas oui.

[Bovino]

Les fichiers sont supposés être récupérés via le tableau $_FILES, pas $_POST.

[zanteskuken]

Oui, j'avais saisi la nuance. Je suis désolé d'avoir mal expliqué du coup.

J'ai bien du côté Php :

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
// On vérifie si le Formulaire est rempli
if(!empty($_POST))
{
	$objILOC = $_FILES['filesToUpload'];
        // Il y a t-il des fichiers ?
        if(!empty($objILOC))
	{
                // On restructure Notre Objet pour qu'il soit mieux présenté à l'utilisation
           	$files_array = $this->reArrayFiles($objILOC);
		$file_count = count($files_array);
		for ($i=0; $i<$file_count; $i++) 
		{
			$file_array = $files_array[$i];
			if( !empty($file_array['name']) )
			{
				// Récupération de l'extension du fichier
				$extension = pathinfo($file_array['name'], PATHINFO_EXTENSION);
				// On vérifie l'extension du fichier
				if(in_array(strtolower($extension),$tabExt))
				{
etc..
...
...
move
 
etc.
...
 
private function reArrayFiles($file_post) 
{
	$file_ary = array();
	$file_count = count($file_post['name']);
	$file_keys = array_keys($file_post);
	for ($i=0; $i<$file_count; $i++) {
		foreach ($file_keys as $key) {
			$file_ary[$i][$key] = $file_post[$key][$i];
		}
	}
	return $file_ary;
}

Je test juste si j'ai un contenu envoyé par $_post
Puis si j'ai des fichiers par $_Files

C'est vrai que je ne l'avais pas affiché dans le sujet, sorry.

C'est ce problème d'envoi qui est étrange.

[Bovino]

Oui, j'avais saisi la nuance.

Manifestement pas tant que ça...

Je test juste si j'ai un contenu envoyé par $_post

Bah oui... mais si tu n'envoies que des fichiers, tu n'auras rien dans $_POST. C'est pour ça que tu ne récupères tes fichiers que si tu envoies des données factices.
Encore une fois, c'est $_FILES qu'il faut tester pour savoir si tu as reçu des fichiers.

[zanteskuken]

Huuuuuuuu

Je n'ai pas maitrisé ce que j'envoyais -_-

Bah oui, tu as tout à fais raison, j’envoie des fichiers donc j'aurai rien dans $_POST.

Je faisais ce test avant car j'envoyais un form

Code html :

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

1
2
3
4
5
6
7
8
9
10
<form method="POST" action={{ path('updatePicksSendF') }} enctype="multipart/form-data">
	 <input type="hidden" name="MAX_FILE_SIZE" value="20000000">
	<label>Fichier :</label> <input type="file" id="fileInput" name="fichier[]" multiple accept="image/*">
   	<table id="tableFiles" style="{background-color:red, width:400px, height:400px}">
   		<tbody class="classTableFiles"></tbody>
   	</table>
	<div class="adhesion_button">
	     	<input type="submit" name="envoyer" value="Envoyer le fichier" class="next_step" id="subFile">
	</div>
</form>

Et dedans il n'y a pas que des fichiers "fichier[]".

Ok ok.

J'ai donc enlever la condition

Code :

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

if(!empty($_POST))

Du coup je réceptionne mes fichiers. Ah mince alors, c'est étourdit ça.

Quand à ce mystère xhr, je n'ai pas encore trouvé.