Can you access the iPhone camera from Mobile Safari?

Question

Is there a JavaScript API for accessing the the iPhone's camera from Mobile Safari?

Solution 1

Since iOS6, you can use

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

It will act like a regular file upload, but instead, it will open the iPhone camera and upload a picture or a video.

Hope this help someone.

Solution 2

You can via http://picupapp.com/

It is a Free iPhone App and JS that can convert an upload box into a button that requests the app, along with instructions to the App on where to post the image...

This thing should get an award.

Now if only we could get them to also make it work perfect with Android and Blackberry.

Solution 3

There is a specification from the W3C which would allow this, although to my knowledge none has implemented it yet: http://www.w3.org/TR/2010/WD-html-media-capture-20100928/

Solution 4

Chrome and Safari on iOS7 can access the Camera and the Camera Roll without any special markup and can perform both AJAX POST and synchronous form POST operations just like a desktop browser.

View more solutions

Comments

[jriskin]

Phonegap allows you to build native apps, it won't help for accessing from the web via Safari.

[Rajesh]

Think about it. The person is trying to make a mobile version of a web site that has the ability to capture images from a phone's camera. I'm pretty sure that people accessing a web app wouldn't be exclusively iOS users.

[subhaze]

Answer to old comment, but relevant. This is why you wouldn't need it for Android hacks.mozilla.org/2012/04/…

[Johannes Klauß]

This should be the accepted answer, since the old one isn't correct anymore.

[James Westgate]

Modified the answer which was incorrent.

[Adil Malik]

Can I somehow remove the Choose Existing button? I want the video to be uploaded directly from camera only.

[Simon Arnold]

Good question @AdilMalik! Unfortunately, not that I'm aware of, but if you find a way, let me know.

[Raj]

Just by using standard HTML file input type: <form action="POST"> <input type="file" name="pic"> <input type="submit"> </form>

[Joel B]

As an addendum to this, it looks like HTML5 offers some interesting ways to get webcam images/video: html5rocks.com/en/tutorials/getusermedia/intro