it-swarm.com.de

FormData-Anhang funktioniert nicht

Ich habe dies geschrieben, um ein Bild mit dem input -Element in HTML auf meinen lokalen Apache-Webserver hochzuladen. Das file wird als nicht leer protokolliert, aber warum ist das form_data Vollständig leer?

$('#upload-image').change(function(e){
    var file = e.target.files[0];
    var imageType = /image.*/;
    if (!file.type.match(imageType))
        return;
    console.log(file);
    var form_data = new FormData();
    form_data.append('file', file);
    console.log(form_data);
    $.ajax({
        url: 'http://localhost/upload.php',
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,
        type: 'POST',
        success: function(response){
            console.log(response);
        },
        error: function(error){
            console.log(error);
        }
    });

});

Dies ist mein upload.php Auf dem lokalen Webserver

<?php
    header('Access-Control-Allow-Origin: *');
    if ( 0 < $_FILES['file']['error'] ) {
        echo 'Error: ' . $_FILES['file']['error'] . '<br>';
    }
    else {
        move_uploaded_file($_FILES['file']['tmp_name'], 'uploads/' . $_FILES['file']['name']);
        $target_path = $_SERVER['DOCUMENT_ROOT'] . "/uploads/" . $_FILES['file']['name'];
        echo $target_path;
    }
?>

Die Funktion console.log(response) protokolliert alle Codezeilen der Datei PHP= anstelle des zurückgegebenen Ergebnisses von echo

24
necroface

Wenn Sie ein formData-Objekt nur mit console.log(formData) protokollieren, wird immer leer zurückgegeben, da Sie formData nicht protokollieren können.

Wenn Sie es nur protokollieren müssen, bevor Sie es senden, können Sie entries() verwenden, um die Einträge im formData-Objekt abzurufen

$('#upload-image').change(function(e) {
    var file = e.target.files[0];
    var imageType = /image.*/;

    if (!file.type.match(imageType)) return;

    var form_data = new FormData();
    form_data.append('file', file);

    for (var key of form_data.entries()) {
        console.log(key[0] + ', ' + key[1]);
    }

    $.ajax({
        url: 'http://localhost/upload.php',
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,
        type: 'POST',
        success: function(response) {
            console.log(response);
        },
        error: function(error) {
            console.log(error);
        }
    });

});
40
adeneo