All geek questions in one place

How to play live rtmp using videojs?

I use OBS to stream live to my local rtmp server (node-rtsp-rtmp-server) and it works well with the VLC media player. I just want to put it in a webpage and I found videojs. It didn’t work and returns the specified type “rtmp / mp4 attribute” is not supported. It seems my rtmp server did not give any requests from this web page. So what did I miss? Here is my code:

<head>
    <meta charset="utf-8">
    <link href="./video-js-6.0.0/video-js.css" rel="stylesheet">
    <script src="./video-js-6.0.0/video.js"></script>
    <script src="./video-js-6.0.0/videojs-flash.min.js"></script>
    <script>
        videojs.options.flash.swf = "./video-js-6.0.0/video-js.swf"
    </script>
</head>
<body>
   <video  id='vid' class='video-js' controls height=300 width=600>
      <source src="rtmp://127.0.0.1:1935/live/pokemon" type="rtmp/mp4"/>
    </video>
    <script>
        var player = videojs('vid');
    </script>
</body>
+4
source share
4 answers

this is what works for me

<html>
<head>
<title> Stream Player </title>
  <link href="video-js.css" rel="stylesheet" type="text/css">
  <script src="video.js"></script>
  <script>
    videojs.options.flash.swf = "video-js.swf";
  </script>
</head>
<body>
 <center>
   <video id="livestream" class="video-js vjs-default-skin vjs-big-play-
centered"
     controls autoplay preload="auto" width="600" height="300"
     data-setup='{"techorder" : ["flash"] }'>
      <source src="rtmp://10.0.0.35:1935/live/test" type="rtmp/mp4">
   </video>
 </center>
</body>
</html>

it looks like you might have a "/" typo in your type. To use the flashjs function, a parameter of data parameter settings is required.

, , javascript .

nginx .

https://obsproject.com/forum/resources/how-to-set-up-your-own-private-rtmp-server-using-nginx.50/

https://github.com/arut/nginx-rtmp-module

+2

RTMP. RTMP - Flash.

, DASH, Media Source.

+1

RTMP -, 2 :

  • RTMP Flash- (Strobe, JwPlayer, FlowPlayer)
  • HTML5 (HLS MPEG DASH) , , Wowza Streaming Engine; , H264 AAC
+1
source

If this works when using the vlc media player, it means your rtmp server is ok. You should check if the browser supports support or not. Since we realized that the latest versions of chrome and Firefox automatically block flash by default. We were able to fix the problem by simply enabling flash on the website. Nothing happened in .js video and videojs-flash. Plz refers to the attached screenshot. enter image description here

-1
source

Source: https://habr.com/ru/post/1674277/

More articles:


All Articles