[英]Does getUserMedia works in ionic-webview in Android app?
I have given all the permissions for camera and microphone. 我已经获得了相机和麦克风的所有权限。 Enable CSP in meta tag for the iframe. 在iframe的元标记中启用CSP。 Still not able to get permission for camera and microphone in getusermedia for iframe. 仍然无法获得iframe的getusermedia中的摄像头和麦克风的权限。
home.html home.html的
ion-content class= 'padding has-subheader'> ion-content class ='padding has-subheader'>
app-component.ts APP-component.ts
constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, private androidPermissions: AndroidPermissions)
{
platform.ready().then
(() =>
{
statusBar.styleDefault();
splashScreen.hide();
this.androidPermissions.requestPermissions([
this.androidPermissions.PERMISSION.CAMERA,
this.androidPermissions.PERMISSION.MODIFY_AUDIO_SETTINGS,
this.androidPermissions.PERMISSION.RECORD_AUDIO
]);
//navigator.mediaDevices
navigator.mediaDevices
.getUserMedia({
audio: true,
video: true
})
.then(mediaStream => {
console.log("Video camera platform ready")
});
});
}
AndroidManifest.xml AndroidManifest.xml中
<uses-sdk android:minSdkVersion="23" android:targetSdkVersion="26" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
Update - 04/11/2018 - Working Ionic example 更新 - 04/11/2018 - 工作离子的例子
As promised I had a crack at this today. 正如我所承诺的那样,今天我对此有所了解。 To answer your question now in full: Yes you can access getUserMedia inside of ionic on Android. 现在全面回答您的问题: 是的,您可以在Android上访问离子内的getUserMedia。
See my GitHub project here for a working example and for screenshots. 见我的GitHub的项目在这里的工作示例和截图。
See this feature branch here which successfully tests getUserMedia inside of an iframe 请参阅此功能分支,它在iframe中成功测试了getUserMedia
Steps involved: 涉及的步骤:
You can also see alternative versions of this for React Native , native Android and Cordova . 您还可以看到React Native , 原生Android和Cordova的替代版本。
As of this update support for iOS is still a no due to Apple security restrictions on WKWebView and UIWebView. 由于苹果对WKWebView和UIWebView的安全限制,对iOS的更新支持仍然是不合适的。
Iframes: To make sure getUserMedia works inside of them make sure you: iframe:要确保getUserMedia在其中工作,请确保:
<iframe allow="camera; microphone">
启用安全权限以访问摄像头和麦克风<iframe allow="camera; microphone">
Please read the following for more info on iframe features: 有关iframe功能的更多信息,请阅读以下内容:
Yes, it theoretically can work. 是的,它理论上可行。 See my example below on how to do it in Android. 请参阅下面的示例,了解如何在Android中执行此操作。 For iOS this isn't currently possible due to the limitations of WKWebView. 对于iOS,由于WKWebView的限制,目前无法实现。 I have linked to a StackOverFlow question below on how people are achieving this on Cordova which Ionic is based off. 我已经链接到下面的StackOverFlow问题,关于人们如何在Cordonic上实现这一目标,Ionic基于此。
The core main steps which need to be achieved to get getUserMedia working on Android regardless of framework are: 无论框架如何,在Android上使用getUserMedia都需要实现的核心主要步骤是:
The issue you are specifically facing is 4. or 5. It looks like the project gets you that far. 您特别面临的问题是4.或5.看起来该项目可以帮助您实现这一目标。 The permission error is most likely down to the Chrome WebView your app is using doesn't override the permission, and/or it is and the user hasn't manually enabled the permission. 权限错误最有可能发生在您的应用正在使用的Chrome WebView未覆盖权限的情况下,和/或它是,并且用户尚未手动启用该权限。
Thus within the Ionic framework you need to extend its Browser to get access to the override onRequestPermissionsResult. 因此,在Ionic框架内,您需要扩展其浏览器以访问覆盖onRequestPermissionsResult。 To do this you need to make a Cordova plugin and then create the Ionic bindings. 要做到这一点,你需要制作一个Cordova插件,然后创建Ionic绑定。
More reading about this for similar frameworks can be found here: 有关类似框架的更多内容可以在这里找到:
In Android Chrome Browser. 在Android Chrome浏览器中。 Navigator.mediaDevice.getUserMedia() will support only from Chrome Version 52. Please check your chrome browser version. Navigator.mediaDevice.getUserMedia()仅支持Chrome版本52.请检查您的Chrome浏览器版本。
You can use Cordova-plugin-media cordova plugin for recording Audio Files. 您可以使用Cordova-plugin-media cordova插件录制音频文件。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.