Javascript 使用XMLHttpRequest上传AJAX文件

Javascript 使用XMLHttpRequest上传AJAX文件,javascript,ajax,file,upload,xmlhttprequest,Javascript,Ajax,File,Upload,Xmlhttprequest,我知道有很多类似的问题,但我仍然没有找到解决问题的方法。 我试图用XMLHttpRequest上传一个文件,因此我开发了以下代码: var sendFiles = function(url,onload,onerror,file,headers){ var xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHttp'), upload = xhr.upload; AP

我知道有很多类似的问题,但我仍然没有找到解决问题的方法。 我试图用XMLHttpRequest上传一个文件,因此我开发了以下代码:

var sendFiles = function(url,onload,onerror,file,headers){
    var xhr = XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHttp'),
    upload = xhr.upload;
    API.addEvent(xhr,'readystatechange',function(){
        if(xhr.readyState==4)
            if((xhr.status>=200 && xhr.status<300) || xhr.status==304){
                this.response = this.response || this.responseText;
                onload.call(xhr);
            }else onerror.call(xhr);
    });
    xhr.open('POST',url,true);
    for(var n=0;n<headers.length;n++)
        xhr.setRequestHeader(headers[n]);
    xhr.send(file);
    return xhr;
};
var sendFiles=函数(url、onload、onerror、文件、标题){
var xhr=XMLHttpRequest?new XMLHttpRequest():new ActiveXObject('Microsoft.XMLHttp'),
upload=xhr.upload;
addEvent(xhr,'readystatechange',function(){
if(xhr.readyState==4)

如果((xhr.status>=200&&xhr.status=200&&xhr.status,Ajax调用将不会限制大小。它可能是php ini文件中的最大文件大小。

更改ini文件中的
post\u max\u size

指令,以避免post\u max\u大小限制问题……但同时也会在两侧出现内存不足问题:

在客户端
  • 使用PUT而不是POST:

    xhr.open(“put”,“upload.php”,true);

  • 添加自定义标题以指定原始文件名和文件大小:

    xhr.setRequestHeader(“X-File-Name”,File.Name);

    xhr.setRequestHeader(“X-File-Size”,File.Size);

  • 在XHR发送方法中直接使用文件对象:

    xhr.send(文件);

    请注意,文件对象可以通过输入[type=File]DOM对象的“files”属性直接获得

在服务器端
  • 通过$\u服务器读取自定义标题:

    $filename=$\u服务器['HTTP\u X\u文件名];

    $filesize=$\u服务器['HTTP\u X\u FILE\u SIZE'];

  • 使用读取文件数据php://input :

    $in=fopen('php://input“,”r“;

然后你就可以发送非常大的文件(1GB或更多),没有任何限制


此代码适用于FireFox 4+、Chrome 6+、IE10+

,ini文件中的上载文件大小限制是多少?很好的解释,谢谢,但您的解决方案有两个限制。1:如果我在XHR.send方法中直接使用file对象,我不能发送多个文件。只有一个文件。2:如PHP手册所述“使用
php://input
只能读取一次”。这意味着使用您的技术不能对一个文件发出多个请求。您还有其他解决方案吗?如何使用php://input'和直接在XHR.send方法中的File对象?我尝试循环XHR.send(文件[n])但是readystate属性的问题是apears。的确,每次调用PHP脚本都是针对一个文件,因此如果您想同时发送多个相关文件,只需在客户端为每个文件分配一个XHR,然后在所有发送完成后,再调用一个引用所有文件的最终PHP脚本,然后执行您必须执行的操作处理这些相关文件。我们有“dropbox-like”内部Web应用程序,在服务器端可以很好地使用该方法。如何使用
$filename$filesize和$in
来复制文件???!我是否使用
copy()
移动上传的文件
?我的服务器上有一个限制,不允许我上传大于2MB的文件!请帮助使用
而($data=fread($in,1024))写入($out,$data);
在服务器上用$out打开的写句柄写入目标文件
<?php
header('Content-type: text/html;charset=ISO-8859-1');
$status = 0;
if(@copy($_FILES['file']['tmp_name'],'test\\' . $_FILES['file']['name']))
    $status = 1;
else
    $err = '0';
echo '{
    "status": ' . $status . '
}';
?>;
var sendFiles = function(url,onload,onerror,file,headers){
    var xhr = XMLHttpRequest ? new XMLHttpRequest() : new    ActiveXObject('Microsoft.XMLHttp'),
    upload = xhr.upload,
    formData = new FormData();
    formData.append('file',file);
    API.addEvent(xhr,'readystatechange',function(){
        if(xhr.readyState==4)
            if((xhr.status>=200 && xhr.status<300) || xhr.status==304){
                this.response = this.response || this.responseText;
                onload.call(xhr);
            }else onerror.call(xhr);
    });
    xhr.open('POST',url,true);
    for(var n=0;n<headers.length;n++)
        xhr.setRequestHeader(headers[n]);
    xhr.send(formData);
    return xhr;
};