概要
bloggerにwebcamを載せてみた。
写真
サンプルコード
<html>
<head>
</head>
<body>
<video id="video_area" style="background-color: #000" autoplay></video>
<button id="start_btn">映像表示開始</button>
<script>
if (typeof navigator.mediaDevices.getUserMedia !== 'function')
{
const err = new Error('getUserMedia()が使えないブラウザだよ');
alert(`${err.name} ${err.message}`);
throw err;
}
const start = document.getElementById('start_btn');
const video = document.getElementById('video_area');
start.addEventListener('click', () => {
navigator.mediaDevices.getUserMedia({
video: true,
audio: false
}).then(stream => video.srcObject = stream).catch(err => alert(`${err.name} ${err.message}`));
}, false);
</script>
</body>
</html>
成果物
以上。
