• Страница 1 из 1
  • 1
Форум » Веб-разработка » HTML + CSS — коды » Онлайн трансляция веб-камеры на сайте (Как сделать онлайн-трансляцию вашей веб-камеры на чистом JS)
Онлайн трансляция веб-камеры на сайте
Angerfist
Понедельник, 05 Сентября 2016 | Сообщение 1
Оффлайн
Vip
Сообщений:767
Награды: 21
Снова нашёл интересный материал о том как сделать онлайн-трансляцию вашей веб-камеры на чистом JavaScript.



Скопируйте код, и посмотрите на результат. Таким образом вы сможете сделать трансляцию видео с вашей веб-камеры на страницу вашего сайта. Видео чат по одному лишь этому материалу вы не сделаете, но сможете сделать вывод того что снимает ваша веб-камера на странице сайта.

Где это можно использовать, решать вам, вообщем тут уже у кого какая фантазия...

В архиве я выложил уже готовую тестовую страницу для того чтобы увидеть в действии скрипт без установки на сайт, скачайте и откройте в браузере, браузер просто запросит доступ к вашей камере.

Установка:
Код

<div class="booth">
<video id="video" width="400" height="300" autoplay></video>
</div>


Немного оформления:
Код

<style type="text/css">
.booth {
  width: 400px;
  background: #ccc;
  border: 5px solid #ddd;
  margin: 0 auto;
}    
</style>


Скрипт:
Код

<script type="text/javascript">
(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('Ошибка! Что-то пошло не так, попробуйте позже.');
  });
})();    
</script>


Чтобы опубликовать материал автор просил указать источник, Автор (Михаил Русаков) myrusakov.ru
Прикрепления: 6388530.jpg (10.8 Kb) · test.rar (0.6 Kb)


No regrets
Страна: (RU)
Kosten
Вторник, 06 Сентября 2016 | Сообщение 2
Онлайн
Администраторы
Сообщений:44269
Награды: 70
Это как так интересно, что можно смотреть что происходит на сайте, но не как не редактировать или вообще что это новое для вебмастера. biggrin
Страна: (RU)
Сопрано
Вторник, 06 Сентября 2016 | Сообщение 3
Оффлайн
Vip
Сообщений:462
Награды: 4
Так ведь для этого в материалу прикреплен тест, чтоб понять это чудо. Angerfist, постоянно что то новое и неизвестное зальет, а потом разбирайся, но разберешься с наслаждением, в чем плюс. smile
Страна: (RU)
Kosten
Вторник, 06 Сентября 2016 | Сообщение 4
Онлайн
Администраторы
Сообщений:44269
Награды: 70
Цитата Trantel ()
Так ведь для этого в материалу прикреплен тест

Так посмотрел и не чего не понял, так вот что на изображение, но как понимаю, в работе там будет отображаться как раз интернет ресурс.

Прикрепления: 9415843.png (0.6 Kb)
Страна: (RU)
Angerfist
Вторник, 06 Сентября 2016 | Сообщение 5
Оффлайн
Vip
Сообщений:767
Награды: 21
Kosten, у тебя веб-камера есть? Всего лишь увидишь себя или то, куда направлена камера, тебя никто больше не увидит.
И как в комментариях на источнике подмечено, данный скрипт мало где можно применить, если только поставить в профиль для создания аватарки или тупо собой любоваться))) Короче пока идей нет никаких, просто для баловства.


No regrets
Страна: (RU)
Angerfist
Вторник, 06 Сентября 2016 | Сообщение 6
Оффлайн
Vip
Сообщений:767
Награды: 21
Kosten, и кстати я открывал через firefox, ваше массовое помешательство гугл хромом для меня непонятно до сих пор...
Только не надо мне его расхваливать, гугл хром я отрицаю с момента его появления и всегда буду ценить только firefox за его обеспечение и функциональность, ладно проехали...)
По поводу хрома я думаю дело в этом Настройки доступа к веб-камере и поэтому не подключается к твоей веб-камере этот скрипт.


No regrets
Страна: (RU)
Форум » Веб-разработка » HTML + CSS — коды » Онлайн трансляция веб-камеры на сайте (Как сделать онлайн-трансляцию вашей веб-камеры на чистом JS)
  • Страница 1 из 1
  • 1
Поиск: