FormData объект не работает с jquery AJAX сообщение?

позволяет перейти прямо в код:

var formData = new FormData();

formData.append('name', dogName);
formData.append('weight', dogWeight);
formData.append('activity', dogActivity);
formData.append('age', dogAge);
formData.append('file', document.getElementById("dogImg").files[0]);
console.log(formData);

Здесь я добавляю некоторые строки и один объект файла к объекту formData, чтобы отправить всю информацию, асинхронную на сервер.

Сразу после этого у меня есть запрос jQuery ajax:

$.ajax({
  type: "POST",
  url: "/foodoo/index.php?method=insertNewDog",
  data: formData,
  processData: false,
  contentType: false,
  success: function(response){
     console.log(response);
  },
  error: function(){
  }
});

Итак, здесь я пытаюсь отправить информацию на сервер, на сервере php файл У меня есть простой print_r POST, поэтому я вижу, что происходит, а что нет.

К сожалению, мой ответ в console.log(данные) пуст.

Также, если вы проверите HEADER на вкладке Network, вы получите следующий пустой вывод:

Функция успеха вызывается (только для уточнения)

Ответы

Ответ 1

Когда вы отправляете запрос ajax через jQuery, и вы хотите отправить FormData, вам не нужно использовать JSON.stringify в этом FormData. Также, когда вы отправляете файл, тип содержимого должен быть multipart/form-data, включая boundry - что-то вроде этого multipart/form-data; boundary=----WebKitFormBoundary0BPm0koKA

Итак, чтобы отправить FormData, включая некоторый файл через jQuery ajax, вам необходимо:

Установите data в FormData без каких-либо изменений.
Установите processData в false (Позволяет запретить jQuery автоматически преобразовывать данные в строку запроса).
Установите contentType в false (это необходимо, потому что иначе jQuery установит его неправильно).

Ваш запрос должен выглядеть следующим образом:

var formData = new FormData();

formData.append('name', dogName);
// ... 
formData.append('file', document.getElementById("dogImg").files[0]);


$.ajax({
    type: "POST",
    url: "/foodoo/index.php?method=insertNewDog",
    data: formData,
    processData: false,
    contentType: false,
    success: function(response) {
        console.log(response);
    },
    error: function(errResponse) {
        console.log(errResponse);
    }
});

Ответ 2

если вы сделали точно такой же проницательный ответ и все еще не работали Не волнуйся its working

может intelligence and quick wath сообщать вам свой not working

но не беспокойтесь, посмотрите network tap

работающий

надеюсь, что это сэкономит ваше время

Ответ 3

//For those who use plain javascript

var form = document.getElementById('registration-form'); //id of form
var formdata = new FormData(form);
var xhr = new XMLHttpRequest();
xhr.open('POST','form.php',true);
// xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 
//if you have included the setRequestHeader remove that line as you need the 
// multipart/form-data as content type.
xhr.onload = function(){
 console.log(xhr.responseText);
}
xhr.send(formdata);