純JavaScript FORMDATA與文件和​​數據上傳的PHP端失敗

Question

我有一個典型的文件上傳表單：

<form id="attachform" enctype="multipart/form-data" action="/app/upload.php" method="POST" target="attachments"> 
     <!-- MAX_FILE_SIZE must precede the file input field --> 
     <input type="hidden" name="func" value="addattach" /> 
     <input type="hidden" name="relnum" value="{$relnum}" /> 
     <input type="hidden" name="MAX_FILE_SIZE" value="75000" /> 
     <!-- Name of input element determines name in $_FILES array --> 
     Select file: <input type="file" name="userfile" id="userfile" /><br/> 
     Add a file name: <input type="text" id="filename" name="filename" /> 
    </form> 
    <input type="button" id="uploadbutton" value="Attach File" onclick="addAttachment('/app/upload.php','attachform','{$relnum}','userfile','filename','uploadbutton','attachments');" /> 

，我使用純JavaScript AJAX，jQuery的不是： 這是完整的javascript函數

function addAttachment(APPPATH,theform,relnum,filebox,filename,thebutton,thetarget){ 
var f = document.getElementById(filename); 
var fb = document.getElementById(filebox); 
var tb = document.getElementById(thebutton); 
var t = document.getElementById(thetarget); 
var fm = document.getElementById(theform); 
///* 
if(fm){ 
    tb.value = "Uploading..."; 

    var fdata = new FormData(fm); 
    var xFile = new ReportXRequest(APPPATH, fdata, t, "att"); 
    if(xFile) 
     xFile.sendRequest("multipart/form-data"); 

} 

}

的ReportXRequest是我的Ajax對象，與我的整個網站的作品。我在jQuery存在之前構建它。

這裏是我的請求對象：

function ReportXRequest(theurl, theparams, thetarget, theoption, /* optional */ thedataform, thefocusitem){ 

var url = theurl; 
var req = null; 
var params = theparams; 
var target = thetarget; 
var myoption = theoption; 
var dataform; // = thedataform; 
var focusitem; 

dataform = thedataform || null; 
focusitem = thefocusitem || null; 

this.onReadyStateChange = function(){ 
    if(req.readyState == 4){ 
     if(req.status == 200){ 
      try{ 
       var response = req.responseText; 

       switch(myoption){ 


        case 'att': 
         var ans = response.split("="); 
         if(ans[1] == "ERROR"){ 
          target = document.getElementById('actionnotice'); 
          target.innerHTML = ans[0]; 
          setTimeout("clearActionnotice()", 3500); 
          break; 
         } 
         target.innerHTML = response; 
         var f = document.getElementById(dataform); 
         if(f) {f.reset();} 
         if(focusitem){ 
          var fi = document.getElementById(focusitem); 
          if(fi) 
           fi.focus(); 
         } 
         break; 


       } 

      } 
       catch(e){ 
        alert("Error retrieving report data:\n" + e.toString()); 
      } 
     } 
    } 
} 

this.sendRequest = function(contenttype="application/x-www-form-urlencoded"){ 
    req = this.getHttpRequestObject(); 
    if(!req){ 
     alert("Cannot instantiate request object!"); 
     return false; 
    } 
    req.onreadystatechange = this.onReadyStateChange; 
    req.open("POST",url,true); 
    req.setRequestHeader("Content-Type",contenttype); 
    req.send(params); 
    return true; 
} 
this.getHttpRequestObject = function(){ 
    var txhp; 
    try 
    { 
     txhp = new XMLHttpRequest(); 
    } 
    catch(e) 
    { 
     try 
     { 
      txhp = new ActiveXObject("Microsoft.XMLHttp"); 
     } 
     catch(e2) 
     { 
      try 
      { 
       txhp = new ActiveXObject("Msxml2.XMLHTTP"); 
      } 
      catch(e3) 
      { 
       return false; 
      } 
     } 
    } 
    return txhp; 
} 

}

在服務器上，我無法讀取和利用$_REQUEST，$_POST和$_FILES。 $_FILES爲空。另外兩個是人口密集，但我無法使用陣列來提取數據，因爲我通常做：

$value = $_POST['indexname']; 

我得到什麼用的$_REQUEST一個的var_dump，$_POST如下：

請求陣列：

array(23) { ["-----------------------------15853197524937 Content-Disposition:_form-data;_name"]=> string(1010) ""func" addattach -----------------------------15853197524937 Content-Disposition: form-data; name="relnum" 18 -----------------------------15853197524937 Content-Disposition: form-data; name="MAX_FILE_SIZE" 75000 -----------------------------15853197524937 Content-Disposition: form-data; name="userfile"; filename="Mamaroneck_Lady.jpg" Content-Type: image/jpeg "image file" -----------------------------15853197524937 Content-Disposition: form-data; name="filename" ML -----------------------------15853197524937-- " ["sid"]=> string(32) "f4f4aeaf385575530e406621301ff2d6" ["perm"]=> string(8) "44444444" ["folder"]=> string(12) "deltatesting" ["tid"]=> string(1) "1" ["uid"]=> string(2) "19" ["clid"]=> string(4) "1054" ["prid"]=> string(1) "1" ["rpid"]=> string(1) "1" } 

The post array: 

array(15) { ["-----------------------------15853197524937 Content-Disposition:_form-data;_name"]=> string(1010) ""func" addattach -----------------------------15853197524937 Content-Disposition: form-data; name="relnum" 18 -----------------------------15853197524937 Content-Disposition: form-data; name="MAX_FILE_SIZE" 75000 -----------------------------15853197524937 Content-Disposition: form-data; name="userfile"; filename="Mamaroneck_Lady.jpg" Content-Type: image/jpeg "image file" -----------------------------15853197524937 Content-Disposition: form-data; name="filename" ML -----------------------------15853197524937-- " } 

我用報價「圖像文件」替換了實際的圖像文件。

有什麼建議嗎？

謝謝。

Answer 1

內容類型需要是multipart/form-data 並指定邊界作爲參數。

你不知道邊界是什麼，所以你需要不指定內容類型頭文件。

當您將FormData對象傳遞給XHR的send方法時，瀏覽器將爲您生成正確的一個。