zoukankan      html  css  js  c++  java
  • 关于H5页面调取麦克风方法mediaDevices.getUserMedia

    想做一个H5页面,在微信端打开,调取手机麦克风进行录音,因为一些原因 不打算用微信的JSSDK提供的音频接口,于是查到了mediaDevices.getUserMedia()方法,经过测试,说一下兼容性问题

    <audio controls="controls"></audio>
    <div class="recorderControl">录制</div>
    <script>
        var promise = navigator.mediaDevices.getUserMedia({
            audio: true
         });
         promise.then(function(stream) {
            alert(stream)

            recorder.ondataavailable = function() {
              //收集媒体设备 获得到的 可以使用的 媒体流数据
              console.log(event.data)
            }
         });

         promise.catch(function(error) {
              alert(error.name)
              alert(error.message)
         });
    </script>

    1.ios手机:

        在http环境下,在微信端打开,不弹任何东西;

        在https环境下,在微信端打开,不弹任何东西

        在http环境下,在safari中打开,走catch方法,分别弹(NotAllowedError)(The request is not allowed by the user agent or the plateform in the current context,possibly because the user denied permission);

        在https环境下,在safari中打开,直接弹是否想要访问麦克风,说明调起麦克风成功

    2.安卓手机: 

        在http环境下,在微信端打开,走catch方法,分别弹(NotSupportedError)(only secure origins are allowed(see: https://goo.gl/YOZkNV));

        在https环境下,在微信端打开,直接弹是否想要访问麦克风,说明调起麦克风成功

        在http环境下,在safari中打开,走catch方法,分别弹(PermissionDeniedError)();

        在https环境下,在safari中打开,直接弹是否想要访问麦克风,说明调起麦克风成功

  • 相关阅读:
    基于 HTML5 + WebGL 实现的垃圾分类系统
    B/S 端基于 HTML5 + WebGL 的 VR 3D 机房数据中心可视化
    基于 Web 端 3D 地铁站可视化系统
    HTML5 + WebGL 实现的垃圾分类系统
    基于HTML5 WebGL的工业化3D电子围栏
    iOS 不支持 PWA,那又怎么样?
    PWA 入门: 写个非常简单的 PWA 页面
    iOS UTI
    canOpenURL: failed for URL: "weixin://app/wx 问题解决方式
    iOS扩大UIButton按钮的可点击区域
  • 原文地址:https://www.cnblogs.com/znLam/p/10139337.html
Copyright © 2011-2022 走看看