Question

我正在尝试使用AJAX和PHP将文件上传到目录。但是我认为AJAX将文件传递到PHP中存在错误。

<form class="csvUpload" enctype="multipart/form-data">
    <input type="file" class="insertCsv" name="csvUpload"></input>
    <input type="submit" class="insertButton"></input>
</form>

AJAX：

$(".csvUpload .insertButton").click(function() {
    event.preventDefault();

    var file = $(".csvUpload .insertCsv").prop('files')[0];
    var data = new FormData();

    data.append('file', file);

    $.ajax({
        url: '/scripts/csvUpload.php', 
        type: 'POST', 
        dataType: 'json', 
        data: ({data}),
        processData: false,
        contentType: false,   
        success: function(data) {
            $(.output).text(data);
        }
    });
});

PHP：

$file = $_FILES['file']['tmp_name'];
$directory = $_SERVER['DOCUMENT_ROOT'] . '/imports/' . $_FILES['file']['name'];

if(move_uploded_file($file, $directory)) {
    echo('Success');
}
else {
    echo json_encode('Error');
}

我尝试了各种传递表单数据的方法，但是每次得到“错误”输出时。如何正确传递文件并检查文件是否被拾取？

Answer 1

data: ({data}),

您正在传递一个简单的对象，并告诉jQuery不要对其进行处理。它将被字符串化，最终发布的数据将为"[object Object]"。

您需要传递FormData对象。仅您的FormData对象。并且不要将其包裹在任何东西中。

data: data,

Answer 2

在这里，我可以使用Ajax上传图像/文件。请遵循以下代码。

HTML：

<form class="csvUpload" enctype="multipart/form-data">
    <input type="file" class="insertCsv" name="csvUpload"></input>
    <input type="submit" class="insertButton"></input>
</form>

Jquery / Ajax：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$('.insertButton').on('click', function(e) { 
e.preventDefault(); 
var url = "/scripts/csvUpload.php";  
var file_data = $(".insertCsv").prop("files")[0]; 
var form_data = new FormData(); 
form_data.append("file", file_data); 
var dataString = 'file_data='+file_data+'&form_data='+form_data;    
form_data.append("data", dataString); 

$.ajax({
        url: "/demo_project/uploade/uploads.php",
        dataType: 'script',
        cache: false,
        contentType: false,
        processData: false,
        data: form_data,                         
        type: 'post',
        success: function(data){
            alert(data); 
        }
    }); 

});
</script>

Uploads.php：

<?php 

define ('SITE_ROOT', realpath(dirname(__FILE__)));
echo SITE_ROOT;
if(isset($_REQUEST['data']) && $_REQUEST['data'] != '') { 
    if ($_FILES['file']['error'] > 0) { 
        echo 'Error: ' . $_FILES['file']['error'] . '<br>'; 
    } else { 
        move_uploaded_file($_FILES['file']['tmp_name'], SITE_ROOT.'/'. $_FILES['file']['name']); 
        echo "success";
    } 
}

?>

使用AJAX和PHP上传文件

2 个答案: