Webview: How to allow/access device camera from a webview url? (on browsers it works)

nativescriptcore
ios
android

#1

I am unable to activate/promt for the device camera when opening a WebView url that requests the media device. This happens on both Android an iOS - but lets just focus on the Android device.

I have done the following:

  • Added all permissions in AndroidManifest.xml + added android:hardwareAccelerated=“true”

  • Installed nativescript-camera to ask permissions and camera.isAvailable returns true

  • Added the webview in html and starts the webview from the component. The webview runs and shows the content of the url, but there is no promt for the camera, as on browsers:
    ngAfterViewInit() {
    const isAvailable = camera.isAvailable();
    console.log('isAvailable: ', isAvailable);

    const webview: WebView = this.webViewRef.nativeElement;

    webview.isUserInteractionEnabled = true;
    webview.src = this.url;

    webview.on(WebView.loadFinishedEvent, (args: LoadEventData) => {
    const message = args.error ? "Error loading " + args.url + ": " + args.error : "WebView finished loading of " + args.url;
    console.log("WebView message - " + message);
    });
    }

I see examples where people are setting setSettings() on the webview object to allow different options, but it seems it doesn’t exists on the NativeScript webview API.

Please help!


#2

You will have to implement WebChromeClient on your WebView (there must be couple of examples already in the forum) and override onPermissionRequest.


#3

Hello @manojdcoder
Thanks for the response - I also got the idea to use WebChromeClient on the WebView as I see many people do in examples outside NativeScript but, my problem is that on the NativeScript WebView component API, there is no such thing as a WebChromClient.
Do you know how I should go about this and use it then?


#4

As I mentioned already, you just have to search there are examples already in the forum. Here is a direct playground link for your convince.

You might have to implement the permission callbacks.


#5

Thank you @manojdcoder
I will try it out!


#6

Hey @manojdcoder

Update
It seems permissions are very fragile, or maybe I just cannot make them work as a promt. But if i change the manifest, I can make the permissions force check on installation, and then everything works:

	<uses-sdk
		android:minSdkVersion="19"
		android:targetSdkVersion="__APILEVEL__" />

	<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
	<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
	<uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.CAMERA" />
	<uses-permission android:name="android.permission.RECORD_AUDIO" />
	<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />

---------------------
Old

I tried your suggestion, and I am able to use the WebChromeClient and also able to overrode permissions (I see in the log that its requesting), but I get an Audio error:
[ERROR:audio_manager_android.cc(273)] Unable to select audio device!

I searched the internet for hours, and im not able to find a solution. This is my AndroidManifest:

<uses-sdk
		android:minSdkVersion="23"
		android:targetSdkVersion="__APILEVEL__" />

	<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" android:maxSdkVersion="18" />
	<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" android:maxSdkVersion="18" />
	<uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.CAMERA" />
	<uses-permission android:name="android.permission.RECORD_AUDIO" android:maxSdkVersion="18" />
	<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" android:maxSdkVersion="18" />

#7

Which device / os version you are using for testing?


#8

I am using a samsung tablet w. Android v7.0 (works on this) and a samsung phone w. Android v4.4.2 (not working).


#9

onPermissionRequest is available only form Android 7 and later. I will let you know if I find time for earlier versions of Android.


#10

Sorry actually its available from Android 5 itself, so it should work on Lollipop and later.