Chrome в dev-версии получил поддержку WebRTC

    Анонсированная в начале мая прошлого года технология Web Real-Time Communications (WebRTC) интегрирована в dev-версию Chrome и, по всей видимости, официально появится в одном из следующих релизов браузера.

    WebRTC представляет собой открытый фреймворк, попавший в ведение Google после покупки ей компании Global IP Solutions, и реализующий собой технологию передачи в реальном времени видео и аудио напрямую между браузерами. Фактически это означает, что Chrome сможет выполнять те же самые функции, которые сейчас выполняет Skype или другие подобные ему плагины (Google talk), причем с точки зрения разработчиков создание таких приложений будет представлять собой простое использование некоторого JavaScript-API, посмотреть которое можно здесь. Интересно то, что Mozilla Foundation предлагает свой вклад в WebRTC — спецификацию MediaStream Processing, позволяющую программно смешивать аудио-потоки или отслеживать движение в передающемся онлайн видео.

    Ключевым понятием в WebRTC API является объект MediaStream, который является общим JavaScript-интерфейсом для взаимодействия с аудио- и видео-потоками. Для того, что разработчик смог организовать взаимодействие с ними, он должен иметь инструмент доступа к микрофону и web-камере пользователя — для этой цели служит функция getUserMedia. В случае, если эта функция завершилась успешно и доступ к камере и микрофону был получен, разработчику возвращается экземпляр класса MediaStream, представляющий из себя, собственно, интерфейс для работы с мультимедиа-данными.


    HTML-код страницы, иллюстрирующий работу с WebRTC API.

    <html>
      <head>
        <title>Тест WebRTC</title>
      </head>
      <body>
    
        <h2>Привет, Хабр!</h2>
    
        <video id="live" autoplay></video>
        <script type="text/javascript">
          video = document.getElementById("live")
    
          navigator.webkitGetUserMedia("video",
              function(stream) {
                video.src = window.webkitURL.createObjectURL(stream)
              },
              function(err) {
                console.log("Ошибка!")
              }
          )
        </script>
      </body>
    </html>
    


    В данном случае функция webkitGetUserMedia получает три параметра, смысл которых заключается в следующем: первый — это строка, определяющая, что мы хотим работать именно с видео, второй — callback-функция, вызываемая в случае успеха попытки доступа к web-камере и, наконец, третий — функция, которая будет вызвана, если получить доступ к оборудованию не удалось по каким-либо причинам.

    Строка window.webkitURL.createObjectURL(stream) представляет собой получение Blob URL (элемент File API) видео-потока, после чего в объекте video и начнется отображение видео.

    Согласно спецификациям WebRTC функция GetUserMedia должна поинтересоваться у пользователя не возражает ли он, что приложением будет получен доступ к его web-камере, приблизительно так же, как это делает Geolocation API.

    [Источники: <1>,<2> ]
    Поделиться публикацией

    Комментарии 10

      0
      Какой-то куцый пример, вместо «и реализующий собой технологию передачи в реальном времени видео и аудио напрямую между браузерами» только доступ к камере.
      Ну ок, выкидываем флеш с еще одной ниши.
        +5
        Да они никак флеш убить задумали!
          +2
          Флеш был смертельно ранен с появлением canvas.
          А сейчас они целятся в скайп.
          0
          сайты будут подглядывать за пользователями?
            +4
            С их разрешения, не забывайте.
            0
            Разработчики Firefox недавно написали пару демок, используя данную технологию people.mozilla.org/~roc/stream-demos/
              +1
              Ожидаемая, но долгожданная новость.

              Надеюсь Мазила тоже сделает нечто аналогичное и это постепенно станет стандартом.
                +2
                Это замечательно. Вот только поставил Dev версию, но по примеру ошибка:
                Uncaught TypeError: Object # has no method 'webkitGetUserMedia'
                  0
                  Автор статьи, переводя статью со второго источника, упустил один важный момент:
                  >The getUserMedia function is among the WebRTC features that are now available in the Chrome developer channel when the browser is launched with the --enable-media-stream flag.
                  0
                  Абсолют внял моим молитвам! Javascript-API для работы с микрофоном и камерой!
                  Господа, заранее прошу прощения за нубский характер вопроса, так как я еще не интересовался всеми фичами HTML5 и остальных технологий, работающих с видео и аудио в браузере.
                  Скажите пожалуйста, а есть ли возможность интерактивного взаимодействия с пользователем в елементе video? Имеется ввиду возможность размещать всякие кнопки в елементе video поверх самого видео. То есть человек смотрит видео, поверх видео клацает всякие кнопки, тем самым отправляя какие-либо данные на сервер. Я понимаю, что вопрос нубский. Я просто провожу аналогию с флешом, хотя даже не знаю, как это реализуется там.
                  Заранее спасибо.

                  Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                  Самое читаемое