Как передать файл при помощи xmlhttprequest?

@steve 

Для передачи файла при помощи XMLHttpRequest (XHR) нужно использовать объект FormData. FormData позволяет собирать данные формы, включая файлы, и отправлять их на сервер с помощью XHR.

Пример кода:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18

// выбираем файл
var fileInput = document.querySelector('input[type="file"]');
var file = fileInput.files[0];

// создаем объект FormData
var formData = new FormData();

// добавляем файл к объекту FormData
formData.append('file', file);

// создаем объект XHR
var xhr = new XMLHttpRequest();

// настраиваем запрос
xhr.open('POST', '/upload', true);

// отправляем запрос
xhr.send(formData);

В приведенном выше примере мы выбираем файл с помощью элемента input типа file, затем создаем объект FormData и добавляем выбранный файл к нему с помощью метода append(). Далее мы создаем объект XMLHttpRequest и отправляем наш объект FormData на сервер с помощью метода send().

На сервере вы можете получить файл с помощью стандартного метода для получения файлов из формы, например, в PHP это может выглядеть так:

1

$file = $_FILES['file'];

Обратите внимание, что этот пример отправляет запрос на URL "/upload". Вам нужно заменить это на URL вашего сервера и обработчика для загрузки файлов.