htmlからphpにajaxを通して画像を渡す方法

Question

function UpdateUserDetails() 
{ 
    var title = $("#title1").val(); 
    var store = $(".search-box").val(); 
    var category= $("#category").val(); 
    var descp=$("#descp1").val(); 
    var price=$("#price1").val(); 
    var value=$("#value1").val(); 
    var location=$("#location1").val(); 
    var url=$("#url1").val(); 
    var id = $("#hidden_user_id").val(); 

    $.post("update.php", { 
     id: id, 
     title:title, 
     store:store, 
     category:category, 
     descp:descp, 
     price:price, 
     value:value, 
     location:location, 
     url:url 

    }, 
    function (data, status) { 
     $("#update_user_modal").modal("hide"); 
    } 
); 
} 

上記は私のコードで、HTMLフォームから値を取り出してからupdate.phpファイルに送信します。どのように私はすべての変数と一緒にこの機能を通して画像ファイルを送ることができますか？私はそれをファイル自体として、あるいはそれをエンコードして送るべきですか？私を助けてください！

Answer 1

非常に基本的なアプローチです：

1. 変換の画像は、base64データHow to convert image into base64 string using javascript
2. にちょうどbase64_decode($b64Image)文字列として、サーバー側でAJAX経由で送信し、

をファイルに生データを保存して、 post_max_sizeをに設定することを忘れないでください。php.iniおよび/またはNginx body_size（これはどのように名前がつけられたか）

Answer 2

FormDataを使用して、ファイルをajax経由でPHPファイルに渡すことができます。たとえば：

$(':file').change(function() { 
var data = new FormData(); 
jQuery.each(jQuery(':file')[0].files, function(i, file) { 
    data.append('file[]', file); 
}); 

次に、あなたは、Ajaxによってそれを送ることができます：

jQuery.ajax({ 
    url: 'your url', 
    data: data, 
    cache: false, 
    dataType: 'json', 
    contentType: false, 
    processData: false, 
    type: 'POST', 
    success: function(data){ 
     //your code 
    } 
}); 

を今、あなたは$ _FILES [ 'ファイル']あなたのPHPの配列のように、これらのファイルを扱うことができます。