2017-06-18 3 views
0

私は、一般的なファイルアップロードフォームがあります。ピュアJavascriptをPHP側で失敗し

<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のアヤックスではなく、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-- " } 

実際の画像ファイルを引用符「画像ファイル」に置き換えました。

提案がありますか?

ありがとうございます。

+3

"ReportXRequestは私のWebサイト全体で動作するmy ajaxオブジェクトです。jQueryが存在する前に構築しました。" - そして、FormData'オブジェクトを扱うことができないように見えますが、あなたはそのコードを含んでいません。あなたは[mcve]を提供する必要があります。 – Quentin

+0

"var_dumpで何を得るのですか" - 何のvar_dump? – Quentin

+0

'document.getElementById(theform);'、 'theform'にフォームIDが含まれていると思いますか?あなたが投稿したコードは、私たちが何が起こっているかを見て、あなたを助けることができるほど近いものではありません。 _ _ _関連コードを投稿してください。 –

答えて

0

コンテンツタイプは、マルチパート/フォームデータであり、境界としてをパラメータとして指定する必要があります。

境界が何であるかわからないので、にコンテンツタイプヘッダーを指定する必要があります。

XHRのsendメソッドにFormDataオブジェクトを渡すと、ブラウザが正しいものを生成します。

+0

あなたは、素晴らしいです!ありがとう、そんなに! – taxidev

関連する問題