FormDataオブジェクトを使用すると、サーバーは空のPOSTを受信します

Question

FormDataオブジェクトを使用して、1つのファイルと1つのテキスト変数をサーバーに送信しようとしています。 Chromeのデベロッパーツールの[ネットワーク]タブを見ると、ファイルと変数が送信されていることがわかります。しかし、$ _POSTと$ _FILES変数でvar_dump（）を試しましたが、両方とも空の配列として表示されます。ここで私は、フォームのために使っているコードです：

var image_upload = document.getElementById("image_upload"); 

if(image_upload.value == '') 
{ 
    alert("Please select a file to upload."); 
} 
else 
{ 
    alert("in"); 
    var ajaxHandler = new XMLHttpRequest(); 
    var content = image_upload.files[0]; 
    var formData = new FormData(); 
    formData.append("type", "5"); 
    formData.append("content", content) 

    ajaxHandler.onreadystatechange = function() { 
     if(ajaxHandler.readyState == 4) 
     { 
     alert(ajaxHandler.responseText); 
     } 
    }; 

    ajaxHandler.open("POST", "newCard", false); 
    ajaxHandler.setRequestHeader("Content-type","multipart/form-data"); 
    ajaxHandler.send(formData); 
} 

私は、コンテンツタイプ「のcharset = UTF-8」せずにこのコードを試してみましたが、違いを確認していないようです。何が起きてる？

Answer 1

コードからajaxHandler.setRequestHeader("Content-type","multipart/form-data");を削除します。 適切なmultipart/form-dataヘッダーに境界文字列を含める必要があります。 FormDataにファイルを追加すると、ブラウザはそのヘッダーを自動的に設定します。