I have a small react app (for mobile only) with image capture tag to click image from camera only (block file picker dialog)
<input type="file" accept="image/*" capture="camera" onChange={this.handleUploadImage} />
I'm using it to capture image from android and ios browsers.
This tag works fine in chrome for android and safari for ios, but when it opens up in facebook messenger's webview then it doesnot open the camera, instead it opens up file picker dialog in android.
So is there any way to open up camera in facebook messenger's webview and block access to file picker dialog?
Any help would be appreciated
From what I can see, you are trying to access camera with input type "file". While it works good in a browser, any webview of an application treats it as a tag for file input/upload.
What you need is to create a module which allows access to camera even in webview, and use that where you want it to. A camera module can be created using getUserMedia() api, also you can checkout webrtc and webkit for this.
Please check the support for getUserMedia() api in different browsers for better understanding. As it dont work in chrome/firefox for ios as of now.
You can also use open source dependencies available, some of which are: