iwij9g
Last Updated: December 06, 2016
·
3.544K
· climboid
Me 3

Using the camera of your phone/tablet without phonegap

Sometimes you just want to get a hold of the camera and the picture it takes with out having to include anything. This is a way you can do that. So far it works for iPhone, iPad (with ios6). Haven't tested in android yet but it should work as well.

You are basically invoking the usage of the camera via html5 input type file accept camera, then you read the data of the imae and add it as base64 to an image tag and you are set!

You can add styles to the input type file to hide it and maybe use a camera icon (just maintain its visibility hidden not display:none)

http://jsfiddle.net/DjXKZ/

Credits

http://robertnyman.com/html5/fileapi/fileapi.html
https://developer.mozilla.org/en-US/docs/Usingfilesfromwebapplications
https://developer.mozilla.org/en-US/docs/DOM/FileReader
http://www.w3.org/html/wg/drafts/html/CR/forms.html#attr-input-accept

Say Thanks
Respond

3 Responses
Add your response

5816
D42a7264714dee5006b9c99d2567a320

Works in Android too, at least on 4.1 running Chrome

over 1 year ago ·
5826
Me 3
over 1 year ago ·
6259
F99bef92fed856768d92edce30ad07c2

I have recently done something very similar but included client side image resizing in browser.

Used http://webreflection.blogspot.de/2010/12/100-client-side-image-resizing.html as a basis for the work and wrote a jquery control to prettify the image upload button.

over 1 year ago ·