Отправка файла post'ом с помощью jQuery

Метод оправки файла без jQuery:

const formData = new FormData();
const fileField = document.querySelector('input[type="file"]');

formData.append('username', 'abc123');
formData.append('avatar', fileField.files[0]);

try {
  const response = await fetch('https://example.com/profile/avatar', {
    method: 'POST',
    body: formData
  });
  const result = await response.json();
  console.log('Успех:', JSON.stringify(result));
} catch (error) {
  console.error('Ошибка:', error);
}

Отправка нескольких файлов:

const formData = new FormData();
const photos = document.querySelector('input[type="file"][multiple]');

formData.append('title', 'Мой отпуск в Вегасе');
for (let i = 0; i < photos.files.length; i++) {
  formData.append('photos', photos.files[i]);
}

try {
  const response = await fetch('https://example.com/posts', {
    method: 'POST',
    body: formData
  });
  const result = await response.json();
  console.log('Успех:', JSON.stringify(result));
} catch (error) {
  console.error('Ошибка:', error);
}

Объект FormData позволяет составить набор пар ключ/значение для отправки при помощи XMLHttpRequest. Это, в первую очередь, предназначено для отправки данных форм, но вы можете использовать этот объект независимо от форм, тогда передаваемые данные будут в том же формате, что и при обычной отправке формы с enctype="multipart/form-data".  Но при попытке отправки Объекта FormData через jquery $.ajax возникают проблемы, т.е. запрос придет, но файл вы не получите. Все это из-за 2 параметров которые в jquery ajax включены по умолчанию.

По умолчанию, данные, переданные в параметр data в качестве объекта (с технической точки зрения, что-либо кроме строки), будут обработаны и преобразованы в строку запроса, для соответствия типу данных по умолчанию — «application/x-www-form-urlencoded; charset=UTF-8». Если необходимо отослать документ DOM или другие специфические данные, то установите данную опцию в false.

При отсылке данных на сервер, указывает тип данных. По умолчанию: «application/x-www-form-urlencoded», что подходит для большинства случаев.

Далее пример отправки файла:

Форма:

Скрипт :