Кажется, я не могу передать свой объект FormData в мой скрипт PHP

Question

Я работаю над небольшой самодельной вещью типа CMS / портфолио, использующей HTML, PHP и Javascript (я пытаюсь не использовать jQuery или node.js), и я не могу создать свой FromData() объект достигает моего php-скрипта ...

Я хочу, чтобы при отправке формы (используемой для создания новой страницы проекта) передайте ее через небольшой фрагмент js, а затем отправьте ееPHP-скрипт, который напишет, что нужно записать в базу данных, создать файлы и т.д ...

Чтобы добиться этого, я пытаюсь использовать объект FormData ().Раньше я делал это с полным запросом в стиле URL (и это сработало!), Но я хочу добавить опцию для загрузки изображений.

Форма объявлена ​​как enctype = "multipart / form-data", и запрос POST также, но, похоже, ничто не касается скрипта php ...

Вот код (я французский, поэтому некоторые имена переменных ...):

<form method="post" id="add_form" enctype="multipart/form-data">
            <fieldset>
                <legend>Infos:</legend><br />

                <label for="add_cat">Catégory:</label>

                <select name="add_cat" id="add_cat">
                    <?php
                        $USR_CATS = $bdd->query('SELECT * FROM cats');
                        while($cat = $USR_CATS->fetch()){ 
                        ?>
                        <option <?php echo 'value="'.$cat['cat'].'"'; ?> <?php if($cat['id'] == 1){echo 'selected';}?> ><?php echo $cat['cat'] ?></option>
                    <?php
                    }
                    $USR_CATS->closeCursor();
                    ?>
                </select><br />
                <input type="button" id="add_newCat" name="add_newCat" value="Ajouter une catégorie"><br />

                <label for="add_titre">Title:</label>
                <input type="text" id="add_titre" name="add_titre" required><br />

                <label for="add_support">Support:</label>
                <input type="text" id="add_support" name="add_support" required><br />

                <label for="add_com">Commentaire du projet:</label>
                <textarea id="add_com" name="add_com" required></textarea><br />
            </fieldset>

            <fieldset id="add_infosFieldset">
                <legend>Infos Techniques:</legend><br />

                <input type="text" class="add_infos" placeholder="ex: Format: 65x84 cm" style="display:block">

                <input type="button" id="add_newInfos" name="add_newInfos" value="Ajouter une information"><br />
            </fieldset>

            <fieldset id="add_imagesFieldset">
            <legend>Images:</legend>
<input type="file" class="add_images" style="display:block">
                    <input type="button" id="add_newImagesBouton" name="add_newImagesBouton" value="Ajouter une image"><br />
            </fieldset>

            <input type="submit">
        </form>

Когда отправлено, результаты этой формы проходят через js:

var add_form = document.getElementById("add_form");
add_form.addEventListener("submit", function(e){
    e.preventDefault();
    add_formData = new FormData();

    //Basic infos
    add_formData.append("add_prjt", true);
    add_formData.append("add_cat", document.getElementById("add_cat").value);
    add_formData.append("add_titre", document.getElementById("add_titre").value);
    add_formData.append("add_support", document.getElementById("add_support").value);
    add_formData.append("add_com", document.getElementById("add_com").value);

    //I had, for that, to make a loop because I want the user to be able to create and fill as many fields as he/she wants
    var infos = document.getElementsByClassName("add_infos"); 
    var infosCh = ""; //So I'm creating a string which will contain them all

    for(var i = 0; i < infos.length; i ++){ 
        infosCh += infos[i].value + "<br />"; //Concatening everything so that the different infos are separated by <br />
    }
    add_formData.append("add_infos", infosCh);

//And then a bunch of shenaningans regarding the number of images people want to upload, so that there can be as much upload buttons as they want, each of them containing several images
    if(add_nbreBoutonsImages > 0){ 
        add_formData.append("add_nbreBoutonsImages", add_nbreBoutonsImages);

        var add_nbreImages = 0; 

        for(var j = 1; j < add_nbreBoutonsImages; j++){
            var nbreImagesUpload = document.getElementById("add_newImages"+j).files.length; //On regarde combien d'images y a été sélectionné
                for(var x = 0; x < nbreImagesUpload; x++){ //Et pour chacune d'entres elles
                    add_nbreImages++;
                    add_formData.append("add_image"+add_nbreImages, document.getElementById("add_newImages"+j).files[x], "add_image"+add_nbreImages);
                }
            }
        }

    //add_formData.contentType = false;
    //add_formData.processData =false;
    //I tried with and without those, but they doesn't seem to work without jQuery


//The problem must come from here...
    var req = new XMLHttpRequest();

    req.open("POST", "add.php", true);
    req.setRequestHeader("Content-Type", "multipart/form-data");
    req.send(add_formData);

});

У меня была более продвинутая версия шага запроса / отправки, но я сначала попытался сделать ее максимально простой, пытаясь заставить его работать

А потом php

if(isset($_POST['add_titre'])){
        $fichierFichier = fopen('fichier.txt', 'a+');
        fputs($fichierFichier, 'ça a marché...');
    }

Пока я просто пытаюсь увидеть, получает ли PHP что-нибудь вообще ... Но даже эти простые инструкции не делают 'не выполняется ... Как будто PHP не получает переменные?

Я не понимаю ... И расстраивает то, что ничего не работает, нет сообщений об ошибках, ничего ..Просто большая белая заготовка

В любом случае, спасибо за ваше время!

Answer 1

Быстрое обновление ситуации: проблема возникает, как только я пытаюсь отправить что-то в PHP, используя ajax с инкапсуляцией "multipart / data-form".

Я понял, что даже другой скрипт изтот же проект перестал работать, как только я изменил свой скрипт ajaxPost (который я использую для отправки вещей через POST через ajax, оригинальное имя), он выглядит так:

function ajaxPost(url, data, callback, isData){
    var req = new XMLHttpRequest();

    req.open("POST", url); 

    req.addEventListener("load", function(){
        if(req.status >= 200 || req.status < 400){
            callback(req.responseText);
        }
        else{
            console.error(req.status + " " + req.statusText + " " + url);
        }
    });

    req.addEventListener("error",function(){ 
        console.error("Erreur réseau avec l'url: " + url);
    });

    //Ajout pour contrôler ou non si on envoie au format JSON
    if(isData){
        req.setRequestHeader("Content-Type", "multipart/form-data");
    }
    else{
        req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
    }
    req.send(data); 
}

Пока я звонюэто и указав, что я хочу "application / x-www-form-urlencoded", все идет хорошо.Но когда я пробую другую опцию, она перестает работать, отправляя formData или простую строку.

Я проверил свой конфигурационный файл php.ini, и file_upload включен.И когда форма сама по себе представляет собой enctype = multipart / form-data, и я пропускаю шаг javascript, он работает ...

Хитрость в том, что мне нужна вся информация сразу, так что все может бытьпри правильном размещении изображения в папке, названной в честь проекта, из которого создается страница, и т. д. *

Итак, в основном все еще на том же месте, но с более ясным пониманием ... Есть ли в любом случаемой php может быть настроен на блокировку таких кросс-лингвистических вещей?Может быть, я не правильно понимаю данные FormData и неправильно их настраиваю?