使用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的一个答案中复制的。 URL： $ _POST和$ _FILES在AJAX文件上传后为空 - 因为它标记为有效，但对我来说......仍然是空的。

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

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

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

Answer 1

你的AJAX逻辑很好。 问题是因为你使用的是一个非常非常过时的jQuery版本，并且在多年的开发过程中对AJAX逻辑进行了许多调整 - 特别是因为支持FormData并通过AJAX发送二进制数据。

你应该将jQuery升级到至少1.12，理想情况下3.2如果你不需要传统的IE支持。

Answer 2

use new version jquery library like this, your ajax code looks good so for this requirement need to update your jquery library . you use old library in that case it is not working 

http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js

更多信息

https://code.jquery.com/jquery/

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <script>
$("#uploadForm").on('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);
    }           
});
}));
</script>