Загрузка файлов с помощью Ajax XMLHttpRequest: устранение ошибки «Не найдена многочастная граница»

При попытке загрузить файл с помощью XMLHttpRequest вы можете возникает ошибка типа «Запрос отклонен, поскольку не найдена составная граница». Эта проблема возникает, когда файл не отправляется правильно в виде запроса multipart/form-data.

Одной из распространенных ошибок является присоединение файла непосредственно к объекту XMLHttpRequest, как показано в коде:

xhr.file = file; // not necessary if you create scopes like this

Этот метод неверен. Вместо этого файл должен быть обернут в объект FormData, который создает правильную полезную нагрузку запроса multipart/form-data:

var formData = new FormData();
formData.append("thefile", file);

После того, как файл будет добавлен в объект FormData, вы можете использовать xhr.send(formData); чтобы отправить запрос. Файл будет доступен на стороне сервера в $_FILES['thefile'] при использовании PHP.

Помните, что вы можете обратиться к таким ресурсам, как демо-версии MDC и Mozilla Hack, для получения дополнительных указаний по загрузке файлов с помощью Ajax XMLHttpRequest.