Отправка вложенного JSON с изображением

Question

Я пытался исследовать способ отправки вложенных запросов JSON через Ajax обратно на сервер. Из моего понимания formdata, который мы в основном используем для отправки изображений или файлов на сервер, не будет работать в этом сценарии, так как FormData не обрабатывает вложенные объекты.

Это полезная нагрузка, которую мне нужно отправить. Какие-либо предложения?

payload = { 
    'login':{ 
    'key':'some_key' 
    }, 
    'user':{ 
    'doc':{ 
     'dp':<here will be the image file>, 
     'date':"some date", 
     'extra':"extra info" 
    }, 
    'fingerprint':'some_fingerprint' 
    } 
} 

Answer 1

Я никогда не был в состоянии передавать данные изображения через Json, но я был в состоянии приложить данные JSON к объекту FormData и вытащить его на части на сервере от объекта запроса.

payload = { 
    'login':{ 
    'key':'some_key' 
    }, 
    'user':{ 
    'doc':{ 
     'dp':"filename you can reassociate on the other side", 
     'date':"some date", 
     'extra':"extra info" 
    }, 
    'fingerprint':'some_fingerprint' 
    } 
} 

var imageData = new FormData(); 

jQuery.each($('#fileInput')[0].files, function (i, file) 
{ 
    var fname = i + "_"; 
    imageData.append(fname, file); 
}); 

imageData.append("payload", JSON.stringify(payload)); 

$.ajax({ 
      url: 'api/imageupload/', 
      type: 'POST', 
      // Form data 
      data: imageData, 
      //Options to tell JQuery not to process data or worry about content-type 
      cache: false, 
      contentType: false, 
      processData: false, 
      async: false 
     }).done(function (data) 
     { 
      alert("woo!"); 

     }); 

В серверной стороне код, вы просто вытащите свойство «полезной нагрузки» и разобрать его там, а затем петлю через ваши FormData и вытащить изображения.