I am building a web app which should open the front camera in the phone with Android (version 4.0+) and after taking the picture the app should upload captured image to my own server.
So is it possible to launch Android phone's front camera by any HTML5 tag or JavaScript code?
I know that rear camera is possible to launch with this tag:
<input type="file" accept="image/*;capture=camera">
But how about front camera? Furthermore, is it possible to add fixed size focus frame to the camera view by using HTML5 web app?
For clarity: Web app is simply the website in my case. It is not any Android app written with PhoneGap or something like that.
Use Device Camera without using PhoneGap or Android Native code
As per I understand you don't want to use PhoneGap for the mobile website but you want to use the native camera option.
In this scenario what I can suggest is you can use Bridgeit which can help you to access the native camera option. Click on the link to check for the demo.
It is very simple to use. You need to add a .js file in your HTML page and call the camera method to access the native camera option of the device.
Sample code:
Use the Bridgeit.js in the HTML header...
<script type="text/javascript" src="http://api.bridgeit.mobi/bridgeit/bridgeit.js"></script>
after that you can call the device camera using the following code:
bridgeit.camera( 'myId', callback, {postURL: '/upload'});
For more detail click on Bridgeit.
Related
Let me explain my architecture - I have a web project in react js, I am using Cordova just as an apk creator by mentioning my website url in the config file. (ie WWW folder of cordova project only contains index.html)
My problem statement is - I am unable to open android camera (file picker works fine).
There is one solution which would work that is to implement camera functionality in java and call it via js.(but i have been limited to not use java).
Is there any alternate solution to this problem?
UPDATE
I tried the plugin inappbrowser (did not work)
I tried crosswalk webview (did not work)
You can do it with pure JS and Image Capture Web API
Here are two examples:
grab-frame-take-photo
imagecapture
If you need native camera HTML5 is enough:
<input type="file" accept="image/*" capture="camera" />
I am working with a project that what I want to achieve is that from web, android or IOS can activate the camera and take a picture
In addition to this, I keep it in a database, I currently work with MVC, C #, SQL and for the front part with html and JavaScrip
Any suggestions to do it?
Or some example on which I can base
You can do it with a hybride application like Ionic or React and you can manipulate the input of camera and mic with mediaDevices API good luck
I am creating an html5 website for mobile and need to get camera access through the web browser without allowing the user to upload the picture from the gallery. I am having trouble making this work in iOS but in Android it works perfect.
Recently we worked on reading a QR code in our website, with manual focus camera in the System browser (Chrome) and the same is tested with Mobile browser (chrome) with mobile camera. We succeed in doing it but, according to the end user feed back its actually taking time to read/scan with manual focus camera and its easy with mobile camera. But as per our requirement we need to implement it on PC browser with manual focus camera.
Is there any way that we can use Mobile device camera to integrate with the PC browser. Currently we are working with few JAVA based mobiles which allow mobile camera to use as web cam. Any help would be appreciated to crack this.
what I have used is cordova has many plugins that can consume using Javascript or if you use angularjs there is a version called ng-cordova.
Cordova https://cordova.apache.org/
Ng-cordova: http://ngcordova.com/
I hope that will help.
You Can Use Mobile Camera With PC Browser But It Is Difficult
Step:
Write An Application To Capture Picture From Phone And Send It To Browser .
Phone And PC Should Be At Same Network And Phone Accessed From Browser with It Local IP address To Get Pictures .
Users Most Install Your Application On They Phones And Set Static IP Adderss For Phones Example 192.168.1.100
In Website You Most Get Picture From 192.168.1.100 And Show It.
I'm starting a project to develop a mobile application where I'll need to access the phone's camera and retrieve a picture/photo.
However, before going to a native application, I would like to know if Dart (compiled to JavaScript, of course) could access Android phone's camera and retrieve that picture. In that case, the application would be web based.
Could Dart do it or I'll need a native application?
(It's more depending on the browser than on the language...)
There is a dedicated html input tag for this since android 3.0 but i dunno if you can easily access it from dart or if it's enough for you..?
There is also the more conventionnal Html5 mediastream (that should fit all your needs) but it wont work below android 4.4...
Yes you can access the camera.
window.navigator.getUserMedia(audio: false, video: true)
.then((MediaStream stream) {
// Stuff happens here
});
Also I've been looking at the Rikulo Gap package and it seems to be able to access the camera as well as other mobile sensors.
https://github.com/rikulo/gap