javascript - 使用 AJAX 和 PHP 上传文件 - $_FILES 数组为空

Question

我已经阅读了近 20 个不同的论坛帖子/stackoverflow 问题/答案，但我就是无法完成这项工作。我已经使用 jQuery/PHP 工作了大约 5 年，但这是我第一次需要使用 AJAX 做这样的事情。

所以...现在，我只是测试并尝试上传 .txt 文件，并尝试使用 file_get_contents() 获取它的内容，并将其发送回我的 JS 代码。

我已经删除了所有花哨的人员并尽可能地简化了我的文件，所以这是我的 HTML 文件:

<div class="container-fluid">
    <div class="row">
        <div class="col-xs-12">
            <form id="uploadForm" action="url/to/php/script">
                <input type="file" name="frame" />
                <input type="submit" value="UPLOAD" />
            </form>
        </div>
    </div>
</div>

和我的 JS

$("#uploadForm").bind('submit',(function(e) {
    e.preventDefault();
    $.ajax({
        url: 'url/to/php/script',
        type: "POST",
        data:  new FormData(this),
        contentType: false,
        cache: false,
        processData: false,
        success: function(data) {
            console.log(data);
        }
    });
}));

在我的 PHP 脚本中，我有 var_dump($_FILES)，它给我一个空数组。

我的 JS 和表单是从 stackoverflow 的一个答案中复制的。网址:$_POST and $_FILES empty after AJAX file upload - 因为它被标记为有效但对我来说......仍然是空的。

通常我的表单有 enctype="multipart/form-data" 和 method="post" 但没有区别。

我的 jQuery 库:http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js

我来到这里是因为我觉得没有更多的东西可以尝试了，无论我做什么，$_FILES 数组都是空的。

Answer 1

您的 AJAX 逻辑没问题。问题是因为您使用的是非常、非常 的 jQuery 版本，并且在多年的开发过程中对 AJAX 逻辑进行了许多调整 - 特别是自增加对 FormData 和通过 AJAX 发送二进制数据的支持。

如果您不需要旧版 IE 支持，您应该至少将 jQuery 升级到 1.12，最好是 3.2。