みかづきブログ その3

3ヶ月つづけてみました。

Navigator.getUserMediaではなくMediaDevices.getUserMediaをつかう

時代に合わせて修正しました。
IEは未対応ですが、マイクロソフト自身がIEの使用を辞めるよう要請しているとのことなので問題ないでしょう。(?)

japanese.engadget.com

Navigator.getUserMedia(非推奨)

const medias = {
  audio: false,
  video: true
};
const video = document.getElementById("video");

navigator.getUserMedia(medias, successCallback, errorCallback);

function successCallback(stream) {
  video.srcObject = stream;
};

function errorCallback(err) {
  alert(err);
};

MediaDevices.getUserMedia(IE未対応)

const medias = {
  audio: false,
  video: true
};
const video = document.getElementById("video");
const promise = navigator.MediaDevices.getUserMedia(medias); // promiseが返ってくる

promise.then(successCallback)
       .chatch(errorCallback);

function successCallback(stream) {
  video.srcObject = stream;
};

function errorCallback(err) {
  alert(err);
};

コールバックを渡すのではなく、promiseを返すようになったのがいまっぽいですね。
併せて下記2つの記事と、

kimizuka.hatenablog.com
kimizuka.hatenablog.com

下記2つのリポジトリを修正しました。

github.com
github.com