FormData 추가가 작동하지 않습니다.

FormData 추가가 작동하지 않습니다.

로컬 Apache 웹 서버에 이미지를 업로드하기 위해 이 글을 썼습니다.input요소를 HTML로 지정합니다.file이 로그는 비어있지 않은 것으로 기록됩니다만,form_data완전히 비어있나요?

$('#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);
        }
    });

});

이건 내 거야upload.php로컬 웹 서버에서

<?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;
    }
?>

그console.log(response)반환된 결과 대신 PHP 파일의 모든 코드 행을 기록합니다.echo

formData 개체를 로깅하는 경우console.log(formData)formData를 기록할 수 없기 때문에 항상 빈 상태로 반환됩니다.

보내기 전에 기록만 해야 한다면entries()formData 객체의 엔트리를 가져오려면

$('#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);
        }
    });

});

내가 깨달은 건contentType: falsejQuery 1.7.0 이후에서만 동작합니다.따라서 올바른 jQuery 버전을 사용하고 있는지 확인하십시오.

언급URL : https://stackoverflow.com/questions/40062477/formdata-append-not-working