This chapter takes IP webcam and VLC media player as an example to show how Webcam component works.

Prerequisite

• Install your IP web camera.

• Log in to the page of the IP camera and make sure it can work.

• Get the RTSP address of the camera from the camera information page or instruction manual.

  Example: rtsp://admin:logo.1234@192.168.0.103/MPEG-4/ch1/main/av_stream

• Download VLC media player and install it.

  Note Follow the license terms when using VLC media player.

Transcode RTSP into HLS by VLC media player

1. Go to the Open Media window from Media -> Open Network Stream....

   

2. Enter the RTSP address in the marked input field and Click Play.

   

   You should see the monitoring video shows in VLC.

   

3. Restart the VLC.

4. Go to the Open Media window and enter the RTSP address in the marked input field.

   

5. Click the down arrow next to Play, select Stream, and click Stream.

6. Click Next.

7. Click the down arrow next to File, select HTTP, and click Add.

   

8. Enter the port and path. Click Next.

   

   Note The port you entered must not be occupied by other application.

9. Check the check box next to Activate Transcoding. Select the Output video type as "Video-Theora + Vorbis (OGG)" and Click Next.

   

10. Click Stream.

    Your HTTP Live Stream service works after the transcoding.

    Note Don't close the VLC until the transcoding is finished.

    The address is: http://192.168.0.102:8080/mystream

    192.168.0.102 is the IP address of your computer.

Note When the Ethernet connection is break off, you may need to configure the VLC player again after reestablishing the Ethernet connection.

Set the Webcam Animation and view the video in the web project

1. Create a Webcam component in your web project.

2. Click "..." at the right of the row Http live stream address.

3. In the Webcam-Http Live Stream Address window, enter http://192.168.0.102:8080/mystream.

4. Click the down arrow at the right of the row Live Stream Video Type and select OGG.