Menggunakan input formulir untuk mengakses kamera dan segera mengunggah foto menggunakan aplikasi web

Saya menemukan jawaban yang brilian ini:

Di iPhone iOS6 dan dari Android ICS dan seterusnya, HTML5 memiliki tag berikut yang memungkinkan Anda mengambil gambar dari perangkat Anda:

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

Pengambilan gambar dapat mengambil nilai seperti kamera, perekam video, dan audio.

Apakah mungkin untuk mengambil satu langkah lebih jauh dengan menggunakan ajax untuk segera mengunggah foto setelah diambil?

Misalnya, menggunakan ponsel saya, setelah saya mengetuk inputnya, itu kemudian membuka kamera yang akan segera memungkinkan saya untuk mengambil foto dan menyimpannya. Ketika saya menyimpannya ke kamera, itu kemudian terdaftar oleh tombol input sebagai file yang akan diunggah.

Apa yang diperlukan agar foto ini segera diunggah daripada menunggu pengguna mengklik tombol Kirim di formulir?

Sangat mudah untuk melakukan ini, cukup kirim file melalui permintaan XHR di dalam penangan onchange input file.

<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);