$ _POSTや$ AJAXファイルが

Question

をアップロードした後、空_FILES私はウェブ開発に新しいですし、私が持ってきた最新の問題はAJAXファイルのアップロードです...

今私は2つのHTMLの入力フィールドを持っています。ファイル入力、ボタンなどがあります。

<input type="file" name="Frame" id="Frame_"/> 
 
<input type="button" name="FrameButton" id="FrameButton_" value="UPLOAD"/>

ボタンが、私は、次のコードを持つ関数を呼び出すクリックされた後..

var frame = document.getElementById('Frame_'); 
 
var frameImg = frame.files[0]; 
 
var form_data = new FormData(); 
 

 
form_data.append('frame', frameImg); 
 

 
jQuery.ajax({ 
 
    url : './handler.php', 
 
    type : 'post', 
 
    data : form_data 
 
    contentType : false, 
 
    processData : false, 
 
    success : alert("Frame Uploaded") 
 
});

私は（のvar_dump）$ _POST配列と$ _FILES配列は、両方の配列が空であることを示します。これはChrome Devでの "Request Payload"にもかかわらずです。

Content-Disposition：form-data; name = "frame";ファイル名=「GoldFrame.jpg」

のContent-Type：画像/ JPEG

私はこれは私がフロントエンドに選択したファイルの情報が「成功していることを意味しているという印象の下で午前れます私のhandler.phpファイルに投稿してください。これは間違った解釈ですか？

いずれにしても、誰かが私の問題に答えてくれますか？それとも、私の答えがある可能性のあるリソースを少なくとも指していますか？同じ行には多くの同様の質問があるようですが、確かな答えを見たことはありません。

これまではこの種のiframeを使用していましたが、これは本当にハックのような方法ですが、今後この種のタスクに柔軟にAjaxを使用したいと考えています。

お手数ですが、

Answer 1

これを試してください。

フォーム（index.htmlを）

<form id="uploadForm"> 
    <input type="file" name="frame" /> 
    <input type="submit" value="UPLOAD" /> 
</form> 

スクリプト（script.js）

$("#uploadForm").on('submit',(function(e) { 
    e.preventDefault(); 
    $.ajax({ 
     url: "handler.php", 
     type: "POST", 
     data: new FormData(this), 
     contentType: false, 
     cache: false, 
     processData: false, 
     success: function(data){ 
      console.log(data); 
     }   
    }); 
})); 

サーバー側（ハンドラ。php）

<?php 

var_dump($_FILES); 

Answer 2

$ _FILES/$ _ POST配列をhandler.phpファイルでvar_dump（）していますか？

これらの変数をajax呼び出しを持つファイルにダンプしようとすると、AJAXがフロントエンド呼び出しを行い、ファイル/ポスト変数がサーバー側変数です...単にhandler.phpファイルにこれらの変数を使用できることを意味します。

handler.phpでvar_dump（）呼び出しを追加し、その結果をajax呼び出しで出力してみてください。あなたが探している結果が表示されることを期待しています。