Як зробити онлайн-трансляцію вашої веб-камери на чистому jаvascript.

Відео: Як зробити бездротову передачу картинки з камери на екран

Всім привіт! Сьогодні я розповім, як зробити онлайн-трансляцію вашої веб-камери на чистому jаvascript.

Отже, для початку створимо структуру.

Відео: ⚠️ відео з Онлайн Веб камери - Як Дивитися Через Інтернет? | Webglazok.Com

 
lang="En"gt; 
 
charset="UTF-8"gt; 
Online streaming your WebCam 
rel="Stylesheet"href="Style.css"gt; 
 
 
class="Booth"gt; 
id="Video"width="400"height="300"autoplaygt;

Думаю, що зі структурою питань бути не повинно, зауважте, що ми підключаємо файл стилів і файл jаvascript.

Тепер перейдемо до css.

.booth { 
 width:400px- 
 background:# ccc- 
 border:10px solid # ddd- 
 margin:0auto- 
}

І, звичайно, найголовніше - jаvascript.

(function(){ 
var video = document.getElementById(`Video`), 
 vendorUrl = window.URL || window.webkitURL- 
 navigator.getMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator. 
mozGetUserMedia || navigator.msGetUserMedia- 
 navigator.getMedia({ 
 video:true, 
 audio:false 
},function(stream){ 
 video.src = vendorUrl.createObjectURL(stream) - 
 video.play() - 
},function(error){ 
 alert(`Помилка! Щось пішло не так, спробуйте пізніше. `) - 
}) - 
}) () -

Як бачите, все дуже просто. Спочатку ми перевіряємо, який браузер, потім створюємо потрібний об`єкт, передаємо параметри і в кінці закидаємо відео в наш блок.

Отже, сьогодні ви дізналися, як зробити онлайн-трансляцію вашої веб-камери на jаvascript. Дякую за увагу! :)

Поділися в соціальних мережах:

Схожі