7

I would like to display IP cameras streaming in RTSP into a web page.

I've tried many solutions, like using VLC to transcode the stream, but none of them seems to be reliable enough to create a real web service. I'm thinking on using some media server like flussonic or Red5. But I don't know if it will work.

This is why I would like to know what is the best (and the simple) solution to display RTSP streams on a webpage.

Arnaud Geotribu
  • 919
  • 4
  • 11
  • 22

3 Answers3

7

...to create a real web service.

I've been looking for an answer for the past two or three days (I need support on as many browsers as possible, and latency as low as possible, so WebRTC was the way to go (is there anything better?)) and I've finally found it.

Check out this repo.

From the repo's readme + the additional steps I had to take (on Ubuntu 18.04) to make this work:

  1. Install go

    $ sudo snap install go --classic

  2. Get the code on your local device (Could someone enlighten me on what the export is for?).

    $ export GO111MODULE=on

    $ go get github.com/deepch/RTSPtoWebRTC

  3. This step didn't work for me, so I just downloaded the code in a .zip file and extracted it in the given directory and proceeded. (What did I miss? The src directory was not there before I made it)

    $ cd ~/go/src/github.com/deepch/RTSPtoWebRTC

  4. Run from current directory.

    $ go run .

  5. Then I opened the link below a web browser ( I tested on Chrome, iOS Safari, but it also works on Firefox).

    http://127.0.0.1:8083

This took me very little time to implement. Big thanks to the guys making this. All the other stuff I've found is either 5-7 years old and not working or non-WebRTC or a marketed paid service asking for unreasonable amounts of money.

I hope I answered your question.

Mikaels Slava
  • 186
  • 2
  • 8
0

After tried the "plugins" way suggested in

How can I display an RTSP video stream in a web page?

And the "conversion" way suggested in

https://www.npmjs.com/package/html5_rtsp_player

I finally found a really straight forward solution using this plugin, works for Chrome only which is ok for my project.

https://www.videoexpertsgroup.com/vxg-chrome-plugin/

This is how the html code look like

    <!DOCTYPE html>
    <html>
      <head>
      <title></title>
      <meta charset="utf-8" />
      <script type="text/javascript" src="/assets/vxgplayer-1.8.31/vxgplayer-1.8.31.min.js"></script>
      <link href="/assets/vxgplayer-1.8.31/vxgplayer-1.8.31.min.css" rel="stylesheet" />
    </head>
     <body>
       <div  class="vxgplayer"
       id="vxg_media_player1"
       width="640"
       height="480"
       url="rtsp://admin:admin@192.168.1.117/defaultPrimary0?streamtype=u"
       nmf-src="/assets/vxgplayer-1.8.31/pnacl/Release/media_player.nmf"
       nmf-path="media_player.nmf"
       useragent-prefix="MMP/3.0"
       latency="10000"
       autohide="2"
       volume="0.7"
       avsync
       autostart
       controls
       mute
       aspect-ratio
       aspect-ratio-mode="1"
       auto-reconnect
       connection-timeout="5000"
       connection-udp="0"
       custom-digital-zoom></div>
    </body>
    </html>
CY Chin
  • 11
  • 2
  • can you help answer a couple of questions for me? I know this is old, but I'm going through this right now. What's the performance like? And, did you ever get this error: WebSocket connection to 'ws://127.0.0.1:8778/' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED – stevenlacerda Feb 02 '18 at 20:17
-1

You can integrate VLC library into your website and VLC will take care of everything you need for playing RTSP stream: https://wiki.videolan.org/index.php?title=HowTo_Integrate_VLC_plugin_in_your_webpage&action=edit&oldid=19150

Rohan Girdhani
  • 29
  • 6