Carga de archivos con Ajax XMLHttpRequest: solución del error "No se encontró ningún límite multiparte"

Al intentar cargar un archivo usando XMLHttpRequest, puede aparece un error como "La solicitud fue rechazada porque no se encontró ningún límite multiparte". Este problema surge cuando el archivo no se envía correctamente como una solicitud de datos de formulario/multiparte.

Un error común es adjuntar el archivo al objeto XMLHttpRequest directamente, como se muestra en el código:

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

Este método es incorrecto. En su lugar, el archivo debe incluirse en un objeto FormData, que construye la carga útil de solicitud de datos de formulario/multiparte adecuada:

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

Una vez que el archivo se agrega al objeto FormData, puede usar xhr.send(formData); para presentar la solicitud. Se podrá acceder al archivo en el lado del servidor dentro de $_FILES['thefile'] si usa PHP.

Recuerde que puede consultar recursos como demostraciones de MDC y Mozilla Hack para obtener más orientación sobre la carga de archivos con Ajax XMLHttpRequest.