Question

我正在使用简单的ajax调用来提交表单数据，我尝试将一些表单输入和文件一起发送。

    $("#submit-uploaded-audio").on("click", function () {
    var post_data = new FormData();
    var file = $("#audio_file").prop('files')[0];

    post_data.append('key1', 'value1');
    post_data.append('key2', 'value2');
    post_data.append('file', file);

    $.ajax({
        url: "/process_audio_upload",
        type: "POST",
        data: post_data,
        cache: false,
        contentType: false,
        processData: false,
        success: function(data) {
            console.log(data);
            // some logic
        },
        error: function(error) {
            // some logic here
        }
    });
});

Ajax调用转到服务器url（codeigniter框架）但是调用中发布的数据没有填充到$ _POST以及$ _FILES（两个数组都是空的）

检查php.ini设置和文件上传设置看起来不错

然而，＆＃34; php：//输入＆＃34;以原始格式显示所需数据

var_dump(file_get_contents("php://input"));

我希望将这些数据放入相应的$ _POST和$ _FILES数组中，以便我可以进行进一步的操作。

提前致谢。

还尝试了以下解决方案

https://stackoverflow.com/a/10899796/4349933

Answer 1

它可能与post_data变量为空相关，因为您创建的是空FormData，然后它可能正在尝试通过jQuery append附加，该FormData.append旨在附加HTML元件...

尝试简单地做：

post_data.key1 = 'value1';
post_data.file = file;
console.log(post_data);

那应该回归：

FormData {key1: "value1", file: {...}}

如果Javascript default requests无法正常工作，我会尝试不仅仅使用jQuery进行测试并执行hurl.it。

编辑：测试网址是否正确

由于post_data似乎没问题，因此请使用相同的网址（即yourdomain.here/process_audio_upload）通过其他网站（例如{{3}}）执行POST请求。如果什么都没有回来，那么URL路由很可能就是问题。

Answer 2

试试这段代码：

$("#submit-uploaded-audio").on("click", function () {
    var post_data = new FormData();
    var file = document.getElementById('audio_file').files[0];

    post_data.append('key1', 'value1');
    post_data.append('key2', 'value2');
    post_data.append('file', file);

    $.ajax({
    url: "/process_audio_upload",
    method: "POST",
    data: post_data,
    contentType: false,
    processData: false,
    success: function(data) {
        console.log(data);
        // some logic
    },
    error: function(error) {
        // some logic here
    }

    });
});

现在尝试打印print_r（$ _ FILES）和print_r（$ _ POST）

我注意到你使用的是'type'参数而不是'method'。所以试试这个代码。我做了一些改动。

Answer 3

尝试通过将<form>元素传递给构造函数来创建formData对象。例如，给出这个html

<form id='a-form' ...>

并假设key1和key2是<input>中<form>个元素的名称

$("#submit-uploaded-audio").on("click", function () {
    var form = document.getElementById('a-form');
    var post_data = new FormData(form);

    $.ajax({
    url: "/process_audio_upload",
    method: "POST",
    data: post_data,
    //etc ...

好文档HERE

Answer 4

经过很多麻烦之后，我实际上得到了解决方法。现在，我使用 “ dropzone js” 库直接将文件上传到 S3存储桶，然后将文件反过来放置到S3存储桶。

如果需要处理文件信息或在服务器上存储文件元数据（例如大小，名称等）-我正在使用dropzone的 on_success 回调处理程序，该处理程序可以将控制权传递给服务器（AJAX调用））并访问以前上传的S3文件以进行进一步的操作。

注意：我知道这可能不是问题的答案，但这就是我所做的。如果有人处于相同的情况，希望以上内容对您没有帮助。

通过AJAX调用时，$ _FILES不会填充文件

4 个答案:

编辑：测试网址是否正确