javascript - 无法使用 AJAX 上传大于 50kb 的文件

Question

虽然我在本地主机上工作正常，但我不确定为什么我的下面的代码不能处理我主机上任何大于 50kb 的文件。

我测试了许多不同的文件大小，我很确定 50kb 是它的极限。如果文件大于 50kb，则永远不会将其传递给 process.php。如果一个文件小于 50kb，它会被传递给 process.php ok。

有没有人可以帮我解决这个问题。我被这个问题困了几个小时。

我确实在 php.ini 中将 upload_max_filesize 设置为 5M。

$( document ).ready(function() {
    $('#img_uploader').on('change', function()
    {
       uploadFiles(this.files);
    }
});

function uploadFiles(fileList)
{
    var xhr = new XMLHttpRequest();
    var formData = new FormData();

    for (var i = 0; i < fileList.length; i++) {
        var file = fileList[i];
        if (!file.type.match('image.*')) {
            continue;
        }
        formData.append('photos[]', file);
        formData.append('request', "uploadImg");
    }

    xhr.open('POST', 'process.php', true);
    xhr.onload = function () {
        if (xhr.status === 200) {
            var data = xhr.responseText;
            console.log(data);
            //convert_json_append_HTML(data);
        } else {
            alert('An error occurred!');
        }
    };
    xhr.send(formData);
}

更新:测试结果

光是定位问题我就花了6个小时。

这真的很奇怪。

1/4 小时审查所有 Javascript 和 PHP 代码，记录每一步以确保代码没有错误。

• 在本地主机上测试了所有场景。效果很好。

2/无论我设置什么限制，更改这三个变量都没有解决问题。所以我将它们更改为默认值。

• upload_max_filesize
• 内存限制
• post_max_size

3/浏览器测试:

创建了 2 个文件:test_1.php 和 test_2.php。 (基本 HTML，不涉及 Javascript)

test_1.php

<form action="test2.php" method="post" enctype="multipart/form-data">
    Select image to upload:
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" value="Upload Image" name="submit">
</form>

test_2.php

<?php
var_dump($_FILES);

HTTP:

Chrome :

• 文件 < 50kb:通过
• 文件 > 50kb:通过

火狐:

• 文件 < 50kb:通过
• 文件 > 50kb:通过

互联网浏览器:

• 文件 < 50kb:通过
• 文件 > 50kb:通过

HTTPS

Chrome :

• 文件 < 50kb:通过
• 文件 > 50kb:失败

火狐:

• 文件 < 50kb:通过
• 文件 > 50kb:通过

互联网浏览器:

• 文件 < 50kb:通过
• 文件 > 50kb:通过

我不确定为什么大于 50kb 的文件无法通过 Chrome 的 HTTPS 协议(protocol)从 test_1.php 传递到 test_2.php。这里有人知道原因吗？或者可以尝试在自己的服务器上进行测试。

Answer 1

您需要为 3 个变量设置所需的值 Check this tutotial

• upload_max_filesize
• 内存限制
• post_max_size