ワイズリマインダー

ブラウザがgetUserMediaに対応しているかチェックする

DEMO

index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>browser check</title>
<script src="index.js"></script>
<body>
<video id="myVideo" width="400" height="300" autoplay="1"></video>
</body>
</html>

index.js

if(navigator.mediaDevices === undefined) navigator.mediaDevices = {};
if(navigator.mediaDevices.getUserMedia === undefined){
  navigator.mediaDevices.getUserMedia = function(constraints){
    var getUserMedia = (navigator.webkitGetUserMedia
                     || navigator.mozGetUserMedia
                     || navigator.msGetUserMedia
                     || navigator.getUserMedia);
    if(!getUserMedia) return Promise.reject(new Error('非対応ブラウザ'));
    return new Promise(function(resolve, reject){
      getUserMedia.call(navigator, constraints, resolve, reject);
    });
  };
};

navigator.mediaDevices.getUserMedia({ audio: true, video: true })
.then(function(stream){
  var video = document.getElementById('myVideo');
  if("srcObject" in video) video.srcObject = stream;
  else video.src = window.URL.createObjectURL(stream);
  video.onloadedmetadata = function(e){
    video.play();
  };
})
.catch(function(err){ console.log(err.name + ": " + err.message); });

コメントを残す

メールアドレスが公開されることはありません。

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください