How can I access iPhone or Android camera using HTML5?

Question

I am trying to create a web application to be built on HTML5 for iPhone or Android browser. How will I be able to access the camera on both instance for me to capture an image and upload it to the web application?

Solution 1

I don't think this is possible. At least, in the current state, HTML5 cannot access the camera (or other peripherals). An alternative would be to create a PhoneGap application, where you can develop the app in HTML5 (which will be wrapped into a native application), with additional libraries (JS) which let you access these.

More info on PhoneGap: http://phonegap.com/start Camera api on PhoneGap: http://docs.phonegap.com/en/1.0.0/phonegap_camera_camera.md.html

Solution 2

Is this work in your case?

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

Solution 3

You can't at the moment. Once the W3C getUserMedia API is finalised and implemented by browsers this will be possible, but right now it isn't. (Opera Mobile have a version that implements it - out of interest).

Solution 4

With iOS6, Apple takes HTML5 photo upload.

http://clubsexytime.com/projects/mobileupload/

View more solutions

Comments

[Dexter Cato]

Thanks sparkymat. I'll go and look through this. What I forgot to mention is that I was going to use the feature to do barcode scanning. Is there an additional plugin that I need to use?

[niceguydave]

Recommended for linking to the W3C specification.