Chris Pollett > Students > Ho

    Print View

    [Bio]

    [Blog]

    [CS 297 Proposal]

    [Deliverable 1]

    [Deliverable 2]

    [Deliverable 3]

    [Deliverable 4]

    [CS297 Report-PDF]

    [CS298 Proposal]

    [CS298 Report-PDF]

    [CS298 Slides-PDF]

























Deliverable 3

Purpose Write a simple app that demonstrate video chat in WebRTC

Work Done The purpose of this assignment is to show that a WebRTC application can be built without a third-party plug-in software. A video Chat application has been built using WebRTC technology which utilizes browsers and Html5 to allow Real-Time Communications (RTC). I used video tag of Html5 and getUserMedia function to capture video stream data. The WebRTC technology uses three APIs such as:

  1. MediaStream - allows the client (e.g., the web browser) to access the stream, such as the one from a WebCam or microphone.
  2. RTCPeerConnection - enable audio or video data transfer, with support for encryption and bandwidth management.
  3. RTCDataChannel - enables peer-to-peer communication for any generic data.
A sample html page using getUserMedia function to specify two video tags would look like this:
  • ...
  • <
  • video id="localVideo" autoplay muted >
  • <
  • video id="remoteVideo" autoplay >
  • <.i> <
  • script src="main.js">
  • ...
  • var constraints = {
  • video: true,
  • audio: true
  • };
  •    
  • if(navigator.getUserMedia) {
  •   navigator.getUserMedia(constraints, getUserMediaOK,
  •   getUserMediaFailed);
  •   } else {
  •   alert('Your browser does not support getUserMedia API');
  •   }
  •  
  • function getUserMediaOK (stream) {
  • window.stream = stream; // make stream available to console
  • videoElement.srcObject = stream;
  • }
  •    
  • function getUserMediaFailed (error) {
  • console.error('Error: ', error);
  • }  
RTCPeerConnection API is the core of WebRTC connection and is able to handle an array of URL objects of STUN and TURN servers, and through which the ICE candidate can find each other.

Some of the codes used in the videoChat application can be found in:
webrtc-PDF index.html_PDF server.js