Media capture

概要

getUserMedia() でカメラ・マイクにアクセスし、MediaStream としてリアルタイムの音声・映像データを取得します。

対応ブラウザ

基本構文

const stream = await navigator.mediaDevices.getUserMedia({
  video: { width: 1280, height: 720 },
  audio: true
});
const video = document.querySelector('video');
video.srcObject = stream;

実務での使いどころ

• Media capture の活用

  Media Capture and Streams API。カメラ・マイクからメディアストリームを取得するAPI。

注意点

アクセシビリティ

• スクリーンリーダーでの読み上げを確認すること。

参考リンク

• MDN Web Docs — Media capture
• Can I use — Media capture