How to Open the Native Camera in Mobile Browsers

Without using JavaScript

You don’t need any JavaScript library or any complicated solutions to open the native camera and take pictures in mobile browsers. It can be accomplished with a combination of attributes for the <input /> element.

You can try out my solution on your mobile device: https://pixochi.github.io/native-camera-in-mobile-browsers

Implementation

The only requirement for using the native camera is the <input /> element with 3 attributes:

1. type="file" — creates a file input that lets the user choose one or more files from their device storage
2. accept="image/*" — the file input accepts only files with an image/* MIME type
3. capture="environment" — the outward-facing camera should be used

Native Android camera