问XMLHttpRequest()没有发送FormData()，导致$_FILES数组空，也没有上传文件
EN

Stack Overflow用户

提问于 2019-02-28 04:13:43

回答 1查看 1.5K关注 0票数 2

我想做的事：

本质上，我试图将一个文件上传到服务器上的一个目录中，用户通过一个HTML元素上传该目录。

为此，我在<input>元素的change事件上创建一个新的change，它应该将上传文件的数据发送到upload.php文件，然后upload.php文件处理上传的文件并将其异步上传到服务器。

我的代码：

HTML

<form class="js-upload-form" method="POST" action="upload.php" enctype="multipart/form-data">
    <input class="button js-uploaded-file" type="file" name="file" />
</form>

document.querySelector('.js-uploaded-file').addEventListener('change', function() {

    let file = this.files[0];
    let formData = new FormData();

    formData.append('file', file);

    let xhr = new XMLHttpRequest();
    xhr.open('POST', 'upload.php', true);

    xhr.setRequestHeader('Content-type', 'multipart/form-data');

    xhr.upload.onprogress = function(e) {

        if (e.lengthComputable) {

            let percentComplete = (e.loaded / e.total) * 100;
            console.log(percentComplete + '% uploaded');

        }
    };

    xhr.onload = function() {

        if (this.status == 200) {

            console.info(this.response);

        }
    };

    xhr.send(formData);

}, false);

PHP (upload.php)

print_r($_FILES);

$currentDir = getcwd();
$uploadDirectory = "/uploads/";

$errors = []; // Store all foreseen and unforseen errors here

$fileName = preg_replace("/[^A-Z0-9._-]/i", "_", $_FILES['file']['name']);
$fileSize = $_FILES['file']['size'];
$fileTmpName = $_FILES['file']['tmp_name'];
$fileType = $_FILES['file']['type'];

$uploadPath = $currentDir . $uploadDirectory . $fileName;

if ($fileSize > 2000000) {
    $errors[] = "This file is more than 2MB. Sorry, it has to be less than or equal to 2MB";
}

if (empty($errors)) {
    $didUpload = move_uploaded_file($fileTmpName, $uploadPath);

    if ($didUpload) {
        echo "The file " . basename($fileName) . " has been uploaded";
    } else {
        echo "An error occurred somewhere. Try again or contact the admin";
    }
} else {
    foreach ($errors as $error) {
        echo $error . "These are the errors" . "\n";
    }
}

我的问题

这段代码根本不起作用。打印$_FILES数组返回一个空数组，控制台记录xhr.response中的错误信息(“某个错误发生在某个地方。请再试一次或联系管理员”)。我真的很感激在解决这个问题上的任何帮助，因为我已经浏览了无数其他关于这个问题的在线资源，尽管我觉得我的代码完全按照他们说的做，但它仍然不起作用。

我尝试过的：

我尝试简单地提交表单，而不是通过添加一个submit按钮来尝试使用FormData()对象和<input> change事件提交表单，尽管页面重定向到.url/upad.php并且没有异步工作，但是$_FILES数组包含上传文件的正确数据，并且文件被上传到服务器，这让我认为我的Javascript代码中肯定有问题，要么与XMLHttpRequest有关，要么涉及FormData对象。

php