Verwenden der Formulareingabe, um auf die Kamera zuzugreifen und Fotos sofort über die Web-App hochzuladen

Ich bin auf diese brillante Antwort gestoßen:

In iPhone iOS6 und ab Android ICS verfügt HTML5 über das folgende Tag, mit dem Sie Bilder von Ihrem Gerät aufnehmen können:

    <input type="file" accept="image/*" capture="camera">

Die Aufnahme kann Werte wie Kamera, Camcorder und Audio annehmen.

Ist es möglich, noch einen Schritt weiter zu gehen, indem Sie Ajax verwenden, um Fotos sofort nach der Aufnahme hochzuladen?

Wenn ich beispielsweise mit meinem Telefon auf den Eingang tippe, wird die Kamera geöffnet, sodass ich sofort ein Foto aufnehmen und speichern kann. Wenn ich es in der Kamera speichere, wird es über die Eingabetaste als hochzuladende Datei aufgelistet.

Was würde es brauchen, um dieses Foto sofort hochzuladen, anstatt darauf zu warten, dass der Benutzer auf die Schaltfläche Senden des Formulars klickt?

Dies ist ganz einfach. Senden Sie die Datei einfach über eine XHR-Anforderung im Onchange-Handler der Dateieingabe.

<input id="myFileInput" type="file" accept="image/*;capture=camera">

var myInput = document.getElementById('myFileInput');

function sendPic() {
    var file = myInput.files[0];

    // Send file here either by adding it to a `FormData` object 
    // and sending that via XHR, or by simply passing the file into 
    // the `send` method of an XHR instance.
}

myInput.addEventListener('change', sendPic, false);