Использование ввода формы для доступа к камере и немедленной загрузки фотографий с помощью веб-приложения

я наткнулся на ответ Это гениально:

в iPhone iOS6 и от Android ICS и далее, HTML5 имеет следующее тег, который позволяет делать снимки с вашего устройства:

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

захват может принимать такие значения, как камера, видеокамера и аудио.

можно ли сделать этот шаг дальше, используя какой-то ajax, чтобы сразу загрузить фотографию после ее принятия?

например, с помощью мой телефон, когда я нажимаю на вход, он открывает камеру, которая сразу же позволит мне взять снимок и сохранить его. Когда я сохраняю его в камеру, он затем отображается кнопкой ввода в качестве файла для загрузки.

Что потребуется для немедленной загрузки этой фотографии вместо того, чтобы ждать, пока пользователь нажмет кнопку отправки формы?

1 64
javascript forms html5 mobile web-applications

1 ответ:

это действительно легко сделать, просто отправьте файл через запрос XHR внутри обработчика onchange ввода файла.

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