關於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中開啟,直接彈是否想要訪問麥克風,說明調起麥克風成功