Question

我试图使用纯javascript和php上传一些图片（带进度条），它似乎只适用于一个文件，但不能同时支持多个文件。我使用js formData和php session.upload_progress.name来做到这一点。

这里是我选择文件的表格：

    <form style='display:none;' method='POST' action='/profile/picture/upload'  enctype='multipart/form-data'>
        <input type='hidden' name='progress' value='".ini_get('session.upload_progress.name')."'/>
        <input type='file' name='files' multiple/>
    </form>

这里是上传文件的js

    var submitFiles = function(form) {
        var xhr;
        if (window.XMLHttpRequest) xhr = new XMLHttpRequest();
        else if (window.ActiveXObject) xhr = new ActiveXObject("Microsoft.XMLHTTP");
        var formData = new FormData();
        xhr.open('POST', form.getAttribute("action"), true);
        formData.append(form.progress.value, "123");
        for (var i = 0; i < form.files.files.length; i++)
            formData.append("mfile[]", form.files.files[i]);
        xhr.onreadystatechange = function(){callBack(xhr)};
        setTimeout(function(){uploadProgress(form);}, 500);
        xhr.send(formData);
};

这里是进度条功能（未完成）

    var uploadProgress = function(form){
    var xhr;
    if(window.XMLHttpRequest) xhr=new XMLHttpRequest(); else if(window.ActiveXObject) xhr=new ActiveXObject("Microsoft.XMLHTTP"); else return;
    xhr.open("POST", form.getAttribute("action"), true);
    xhr.onreadystatechange = function(){
        if(xhr.readyState == 4){
            if(xhr.status == 200){
                alert(xhr.responseText);
                timer = setTimeout(function(){uploadProgress();}, 500);
            }
        }
    };
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhr.send();
};

这是php返回进度状态

require_once ($_SERVER['DOCUMENT_ROOT'] ."/php_common/php_header.php"); //to start session 
echo("SESSION:");print_r($_SESSION);

所有这些工作都在仅选择一个文件时反馈了上传进度：

    SESSION:Array
(
    [UID] => 1000000000
    [upload_progress_123] => Array
        (
            [start_time] => 1439971492
            [content_length] => 3080300
            [bytes_processed] => 5239
            [done] => 
            [files] => Array
                (
                    [0] => Array
                        (
                            [field_name] => mfile[]
                            [name] => 7027380-dream-land-nature.jpg
                            [tmp_name] => 
                            [error] => 0
                            [done] => 
                            [start_time] => 1439971492
                            [bytes_processed] => 0
                        )

                )

        )

)

但如果我选择了许多文件，它就不起作用了：

SESSION:Array
(
    [UID] => 1000000000
)

你可以告诉我为什么这不起作用以及如何使用纯js（没有jquery或其他框架）和php上传文件（带进度反馈）。谢谢你的帮助。

Answer 1

我错过了（或者更好地说忘了这里的一点）这就是发布的文件比apache php默认设置允许的大。对于那些可能有相同问题的人来说，请考虑编辑：

C:\wamp\bin\apache\apache2.2.8\bin\php.ini

并根据需要更改这些值：

post_max_size = 750M
upload_max_filesize = 750M
max_execution_time = 5000
max_input_time = 5000
memory_limit = 1000M

从网站上获取的示例，您可能不需要所有内存和时间：对我来说，我设置了

post_max_size = 99M
upload_max_filesize = 99M
max_execution_time = 500
max_input_time = 500
memory_limit = 128M

session.upload_progress.name不支持使用formdata上传多个文件

1 个答案: