¿Puede Webkit JavaScript PUT o POST una imagen REST-style como binario puro?

Question

Cuando mi navegador descarga una imagen de un sitio web, no hay codificación base64 involucrada. Emite un comando HTTP como GET /image.jpg y recibe una respuesta HTTP cuyo Content-Type es algo así como image/jpg, cuyo Content-Length es el número de bytes en la imagen y cuyo cuerpo es la información de imagen binaria en bruto. Los datos no están codificados usando un conjunto de caracteres ni codificados con un esquema como base64.

Escribir recursos REST me ha entrenado para esperar simetría entre HTTP y GETPUT de manera que, por ejemplo, una dirección URL que proporciona datos JSON cuando hago un GET entonces aceptar datos JSON cuando se presenta con un PUT. En ninguno de los casos está involucrada la codificación de forma; en ambos casos hay simplemente un Content-Length dando el número de bytes en la carga útil, un encabezado Content-Type declarando que la carga útil es JSON en algún juego de caracteres, y luego los datos del personaje se encuentran solos y sin adornos como el cuerpo del GET o PUT.

Estoy escribiendo una aplicación PhoneGap que permite a los usuarios tomar fotografías y las cargan usando mi aplicación. Esperaba poder diseñar una interfaz RESTful para esto, que admite GET y PUT simétricos - de modo que los comandos PUT no implican codificación especial, ni implican ninguna idea de un juego de caracteres, sino que simplemente tienen un Content-Type de image/jpg y luego una masa de datos binarios JPG como su carga útil. Obviamente, este es un uso más eficiente del ancho de banda que tratar de codificar la imagen dentro de un formulario. Y este enfoque funciona bien cuando I PUT a una URL usando una herramienta como curl.

Pero no estoy teniendo suerte en hacer un RESTful limpio PUT de PhoneGap WebKit JavaScript! PhoneGap está dispuesto a devolver la imagen a mi JavaScript como una URL local file:, o bien como una URL data: que transporta los datos de imagen en línea cortesía de la codificación base64. Pero en ninguno de los casos puedo encontrar una forma clara de convertir la imagen en un formato binario puro (¿usaría uno de esos objetos nuevos Blob para esto? En caso afirmativo, ¿cómo?) Y luego causaría un PUT que, sin festonar la solicitud con capas adicionales de forma o codificación de cruft, simplemente transmitirán la imagen sin procesar a través del cable a mi servidor web como la carga útil de la solicitud HTTP.

¿Alguien sabe cómo inducir WebKit a PUT una solicitud AJAX con una imagen cruda como su cuerpo? Gracias por cualquier sugerencia, ¡o incluso cualquier respuesta útil al efecto de que me estoy equivocando!

Answer 1

En cuanto al procesamiento de imágenes binarias, el Binary File Inspector demo puede ser útil como un ejemplo de extremo a extremo.

Hay alguna información de tutorial sobre el tema de obtener Blob s del sistema de archivos en MDN. This blog post describe cómo convertir un URI base64 en ArrayBuffer y luego en Blob.

Finalmente, se puede cargar ArrayBuffer o Blobusing the XMLHttpRequest2 interface.

The XHR2 spec seems to imply que es compatible con PUT, junto con un montón de otros métodos HTTP. Entonces, combinando todo esto, puede rellenar archivos en Blob sy enviarlos usando XHR2.

---

ejemplo de código no probado usando el método de decodificación base 64 con la ayuda de base64-binary.js:

var BASE_64_PREFIX = "base64,"; 
function getBase64Content(base64Uri) { 
    var index = base64Uri.indexOf(BASE_64_PREFIX); 
    return base64Uri.substring(index + BASE_64_PREFIX.length); 
} 

function put(uri, data, onComplete) { 
    var xhr = new XMLHttpRequest(); 
    xhr.open("PUT", uri, true); 
    xhr.onload = onComplete; 

    xhr.send(data); 
} 

var base64Uri = fromPhoneGap(); 
var base64Content = getBase64Content(base64Uri); 
var arrayBuffer = Base64Binary.decodeArrayBuffer(base64Content); 

put("/some/uri", arrayBuffer, function() { 
    console.log("All done"); 
}); 

---

Dicho esto, dudo mucho de esto funciona en incluso la última WebKit escritorio, y mucho menos la versión que va a ser cargado con PhoneGap. Probablemente no estés en buena forma para aprovechar estas especificaciones preliminares.