How to access a mobile s camera from a web app

Question

In my web app  not native app  for mobiles  I want to take a photo and upload it  but I don t want to use Adobe Flash  Is there any way to do this

User · Answer

I don t think you can - there is a W3C draft API to get audio or video  but there is no implementation yet on any of the major mobile OSs   Second best The only option is to go with Dennis  suggestion to use PhoneGap  This will mean you need to create a native app and add it to the mobile app store marketplace

User · Answer

You ll want to use getUserMedia to access the camera   This tutorial outlines the basics of accessing a device camera from the browser  https   medium com  aBenjamin765 make-a-camera-web-app-tutorial-part-1-ec284af8dddf   Note  This works on most Android devices  and in iOS in Safari only

User · Answer

In iPhone iOS6 and from Android ICS onwards  HTML5 has the following tag which allows you to take pictures from your device     lt input type  file  accept  image    capture  camera  gt    Capture can take values like camera  camcorder and audio   I think this tag will definitely not work in iOS5  not sure about it

User · Answer

AppMobi HTML5 SDK once promised access to native device functionality - including the camera - from an HTML5-based app  but is no longer Google-owned  Instead  try the HTML5-based answers in this post

User · Answer

I don t know of any way to access a mobile phone s camera from the web browser without some additional mechanism  i e  Flash or some type of container that allows access to the hardware API   For the latter have a look at PhoneGap  http   docs phonegap com phonegap camera camera md html  With this you should be able to access the camera at least on iOS and Android-based devices

User · Answer

Nowadays at least with android it s relatively easy  Just use normal file input tag and when user clicks it the phone will ask if user wants to use camera  or file managers etc    to upload a file  Just take a photo with the camera and it will automatically be added and uploaded    No idea about iphone  Maybe someone can enlighten on that  EDIT  Iphone works similarly   Sample of the input tag    lt input type  file  accept  image    capture  camera  gt

User · Answer

Safari  amp  Chrome on iOS 6  and Android 2 2  support HTML Media Capture which allows you to take pictures with your device s camera or select an existing one    lt input type  file  accept  image    gt   Here s how it works on iOS 10     Android 3 0  and Safari on iOS10 3  also support the capture attribute which is used to jump straight to the camera    lt input type  file  accept  image    capture gt   capture  camera   String  and accept  image   capture camera   Parameter  were part of old specs and were replaced by capture  Boolean  the W3C Candidate Recommendation   Support documentation  this 2013 O Reilly book and my testing

User · Answer

You can use WEBRTC but unfortunately it is not supported by all web browsers  BELOW IS THE LINK TO SHOW WHICH BROWSERS supports it http   caniuse com stream  And this link gives you an idea of how you can access it sample code   http   www html5rocks com en tutorials getusermedia intro

User · Answer

well  there s a new HTML5 features for accessing the native device camera -   getUserMedia  API   NOTE  HTML5 can handle photo capture from a web page on Android devices  at least on the latest versions  run by the Honeycomb OS  but it can   t handle it on iPhones but  iOS 6

User · Answer

Just to update this  the standard now is    lt input type  file  name  image  accept  image    capture  environment  gt    to access the environment-facing  rear  camera  and    lt input type  file  name  image  accept  image    capture  user  gt    for user-facing  front  camera  To access video  substitute  video  for  image  in name   Tested on iPhone 5c  running iOS 10 3 3  firmware 760  works fine   https   www w3 org TR html-media-capture

User · Answer

It should be noted that security features have been implemented which require either the app to be ran locally under localhost  or through SSL for GetUserMedia   to work   I discovered this when trying several of the demos available and was dissapointed when they didn t work  See  New Security Restrictions

[html] How to access a mobile's camera from a web app?

Examples related to html

Examples related to mobile

Examples related to camera