文章/答案/技术大牛

发布

社区首页 >问答首页 >getUserMedia在Android应用程序中的离子型webview中工作吗？

问getUserMedia在Android应用程序中的离子型webview中工作吗？
EN

Stack Overflow用户

提问于 2018-09-28 14:46:06

回答 2查看 5.5K关注 0票数 1

我已经给了所有相机和麦克风的许可。为iframe启用元标记中的CSP。仍然无法获得许可的相机和麦克风在getusermedia为iframe。

home.html

离子含量class=的填充子头class==‘class=3’>

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

 <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" />

android

ionic-framework

getusermedia

ionic-webview

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-10-31 09:20:01

更新- 04/11/2018 -工作离子示例

正如我所承诺的，我今天对此很感兴趣。现在要完整地回答您的问题：是的，您可以在Android.上访问离子内的getUserMedia。

有关工作示例和屏幕截图，请参阅我的GitHub项目这里。

请参见此特性分支这里，它成功地在iframe中测试了getUserMedia。

所涉步骤：

安装离子
离子启动getUserMedia空白
cd getUserMedia
离子cordova插件添加cordova插件-android-权限
npm安装-保存@离子型-本机/android-权限
npm安装webrtc-适配器-保存
链接到angular.json脚本中的适配器(链接)
将AndroidPermissions添加到app.module.ts提供者(链接)
在home.component.ts (链接)中创建相机访问代码
向config.xml和AndroidManifest.xml添加android最疯狂的权限(链接，如果配置没有复制，请转到AndroidManifest.xml
离子cordova平台添加android
离子cordova构建android系统
离子cordova运行android

您还可以看到React Native、原生Android和科多瓦的替代版本。

到目前为止，由于苹果对WKWebView和UIWebView的安全限制，对WKWebView和UIWebView的支持仍然是否定的。

Iframes:确保getUserMedia在其内部工作，确保：

嵌入式站点的CORS需要有允许的访问源标头。
启用安全权限以访问照相机和麦克风<iframe allow="camera; microphone">

有关iframe功能的更多信息，请阅读以下内容：

是的，理论上是可以的。请参阅下面关于如何在Android中执行此操作的示例。对于iOS，由于WKWebView的限制，目前不可能这样做。我已经链接到一个StackOverFlow问题，关于人们是如何在科多瓦实现这一目标的，Ionic是以它为基础的。

无论框架如何，让getUserMedia在安卓上工作需要实现的核心主要步骤是：

确保您的应用程序是Android 21及以上。
向报表添加权限(链接到文件)
确保您使用getUserMedia适配器来实现API兼容性。
确保将webrtc添加到Android文件(链接到文件)中
将Chrome WebView权限重写为大访问(链接到文件示例，第106行)
在应用程序启动时，询问用户访问相机的权限。

你具体面对的问题是4.或5，看起来这个项目让你走得那么远。权限错误很可能是由于您的应用程序使用的Chrome WebView没有覆盖该权限，而且/或者是的，而且用户没有手动启用该权限。

因此，在Ionic框架中，您需要扩展它的浏览器来访问覆盖onRequestPermissionsResult。为此，您需要制作一个Cordova插件，然后创建Ionic绑定。

有关类似框架的更多相关内容，请参见以下内容：

票数 6

Stack Overflow用户

发布于 2018-09-28 14:54:33

在Android浏览器中。Navigator.mediaDevice.getUserMedia()只支持Chrome 52。请检查您的铬浏览器版本。

您可以使用cordova插件-媒体cordova插件录制音频文件.

票数 -1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/52557767

复制

相似问题

问getUserMedia在Android应用程序中的离子型webview中工作吗？
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问getUserMedia在Android应用程序中的离子型webview中工作吗？EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问getUserMedia在Android应用程序中的离子型webview中工作吗？
EN