В своем веб-приложении (не нативном) для мобильных устройств я хочу сделать фотографию и загрузить ее, но я не хочу использовать Adobe Flash. Есть какой-либо способ сделать это?
В своем веб-приложении (не нативном) для мобильных устройств я хочу сделать фотографию и загрузить ее, но я не хочу использовать Adobe Flash. Есть какой-либо способ сделать это?
Ответы:
В iPhone iOS6 и начиная с Android ICS и далее HTML5 имеет следующий тег, позволяющий делать снимки с вашего устройства:
<input type="file" accept="image/*" capture="camera">
Capture
может принимать значения, такие как камера, видеокамера и аудио.
Я думаю, что этот тег определенно не будет работать в iOS5, не уверен в этом.
<input type="file" accept="image/*;capture=camera">
вместо этого. Согласно MDN, capture
для input
элемента нет атрибута .
capture="camera"
(String) и старшее accept="image/*;capture=camera"
были заменены в 2012 году на capture="capture"
(Boolean). Атрибут используется для принудительного захвата вместо выбора из библиотеки. См. Спецификацию и правильный синтаксис для захвата мультимедиа в формате HTML
В настоящее время, по крайней мере, с Android это относительно легко. Просто используйте обычный тег ввода файла, и когда пользователь щелкнет по нему, телефон спросит, хочет ли пользователь использовать камеру (или файловые менеджеры и т. Д.) Для загрузки файла. Просто сделайте фотографию с камерой, и она будет автоматически добавлена и загружена.
Понятия не имею об iphone. Может быть, кто-то может пролить свет на это. РЕДАКТИРОВАТЬ: Iphone работает аналогично.
Пример входного тега:
<input type="file" accept="image/*" capture="camera">
multiple
работает как на Android, так и на iOS, см. Правильный синтаксис для захвата мультимедиа в формате HTML
Просто чтобы обновить это, стандарт теперь:
<input type="file" name="image" accept="image/*" capture="environment">
чтобы получить доступ к окружающей (задней) камере, и
<input type="file" name="image" accept="image/*" capture="user">
для фронтальной камеры. Чтобы получить доступ к видео, замените «видео» на «изображение» в названии.
Протестировано на iPhone 5c, работает под управлением iOS 10.3.3, прошивка 760, работает отлично.
Safari & Chrome на iOS 6+ и Android 2.2+ поддерживает HTML Media Capture, что позволяет делать снимки с камеры вашего устройства или выбирать существующую:
<input type="file" accept="image/*">
Вот как это работает на iOS 10:
Android 3.0+ и Safari на iOS10.3 + также поддерживают capture
атрибут, который используется для перехода прямо к камере.
<input type="file" accept="image/*" capture>
capture="camera"
(String) и accept="image/*;capture=camera"
(Parameter) были частью старых спецификаций и были заменены capture
(Boolean) Рекомендацией кандидата W3C.
Вспомогательная документация: эта книга О'Рейли 2013 года и мое тестирование
capture
вместо capture="camera"
. Любопытно, что устройство и версия Android.
ну, есть новая функция HTML5 для доступа к встроенной камере устройства - «getUserMedia API»
ПРИМЕЧАНИЕ. HTML5 может обрабатывать захват фотографий с веб-страницы на устройствах Android (по крайней мере, в последних версиях, работающих под управлением ОС Honeycomb; но он не может обрабатывать их на iPhone, кроме iOS 6).
Вы можете использовать WEBRTC, но, к сожалению, он поддерживается не всеми веб-браузерами. НИЖЕ ССЫЛКА, ЧТОБЫ ПОКАЗАТЬ, КАКИЕ БРАУЗЕРЫ поддерживают это http://caniuse.com/stream
И эта ссылка дает вам представление о том, как вы можете получить к нему доступ (пример кода). http://www.html5rocks.com/en/tutorials/getusermedia/intro/
getUserMedia
излишне, <input type="file" accept="image/*">
сделает свое дело.
AppMobi HTML5 SDK когда-то обещал доступ к встроенным функциям устройства - включая камеру - из приложения на основе HTML5, но больше не принадлежит Google. Вместо этого попробуйте ответы на основе HTML5 в этом посте .
Вы хотите использовать getUserMedia для доступа к камере.
В этом руководстве описаны основы доступа к камере устройства из браузера: https://medium.com/@aBenjamin765/make-a-camera-web-app-tutorial-part-1-ec284af8dddf
Примечание. Это работает на большинстве устройств Android и только в iOS в Safari.
Следует отметить, что реализованы функции безопасности, которые требуют, чтобы приложение работало локально под localhost или через SSL для работы GetUserMedia ().
Я обнаружил это, когда попробовал несколько доступных демоверсий, и был разочарован, когда они не работали! Смотрите: Новые ограничения безопасности
Я не думаю, что вы можете - есть черновой API W3C для получения аудио или видео, но пока нет реализации ни в одной из основных мобильных ОС.
Второй лучший вариант Единственный вариант - согласиться с предложением Денниса использовать PhoneGap. Это будет означать, что вам нужно создать собственное приложение и добавить его в магазин мобильных приложений.
Я не знаю ни одного способа получить доступ к камере мобильного телефона из веб-браузера без какого-либо дополнительного механизма (например, Flash или какого-либо типа контейнера, который обеспечивает доступ к аппаратному API)
Для последнего взгляните на PhoneGap: http://docs.phonegap.com/phonegap_camera_camera.md.html
Благодаря этому вы сможете получить доступ к камере, по крайней мере, на устройствах с iOS и Android.