How to play RTMP or HLS stream on website from android?

Question

Nginx

Configured Nginx to issue an RTMP and HLS stream. The config is the following:

live on;
hls on;
hls_path /tmp/hls/office1/;
exec_pull ffmpeg  -i rtsp://admin:[email protected]/cam/realmonitor?channel=01&subtype=00 -c copy -f flv -an rtmp://localhost:1935/office1/stream 2>>/usr/rtmp/office.log;

Inserted JWPlayer into the page

<script type="text/javascript">
jwplayer("container1").setup({
sources: [ {
file: "rtmp://10.10.10.10:1935/office1/stream"
},
{
file: "http://10.10.10.10/hls/office1/stream.m3u8"
} ],
});
</script>

Through the desktop, the stream goes fine. But with android does not want to.
If I understand correctly, only HLS is picked up by android and it is not generated without recourse to RTSP?
Please tell me another player for Android, iOS, Desktop

Answer 1

In general, to generate hls, I had to keep the RTSP stream from the camera constantly running through exec_static ffmpeg .. in the nginx config. On the site page, the following script for the UPPOD player:

<div id="videoplayer1" style="width:480px;height:270px;">
    <script type="text/javascript">
    var ua = navigator.userAgent.toLowerCase();
    var flashInstalled = false;
    if (typeof(navigator.plugins)!="undefined" && typeof(navigator.plugins["Shockwave Flash"])=="object") { 
           flashInstalled = true; 
    } else if (typeof  window.ActiveXObject !=  "undefined") { 
      try { 
        if (new ActiveXObject("ShockwaveFlash.ShockwaveFlash")) { 
          flashInstalled = true; 
        } 
      } catch(e) {}; 
    };
     if(ua.indexOf("iphone") != -1 || ua.indexOf("ipad") != -1 || (ua.indexOf("android") != -1 && !flashInstalled)){
     		// HTML5
           
          this.videoplayer1 = new Uppod({m:"video",uid:"videoplayer1",comment:"Улица ночью",file:"http://1.2.3.4/hls/cam/stream.m3u8",st:"uppodvideo"});
           
           }else{
        if(!flashInstalled){
        	 // NO FLASH
           document.getElementById("videoplayer1").innerHTML="<a href=http://www.adobe.com/go/getflashplayer>Требуется установить Flash-плеер</a>";
        }else{
           // FLASH
               var flashvars = {"comment":"Улица ночью","st":"http://5.6.7.8/st/video248-69.txt","file":"rtmp://1.2.3.4/cam/stream"};var params = {wmode:"transparent", allowFullScreen:"true", allowScriptAccess:"always",id:"videoplayer1"}; new swfobject.embedSWF("http://5.6.7.8/player/uppod.swf", "videoplayer1", "960", "576", "9.0.115.0", false, flashvars, params);
              }

}

Answer 2

on android/ios no flash, use html5 video

Answer 3

HLS is generated via ffmpeg on the server.
There, under a bunch of screenshots, there is an example sanasol.ws/2016/08/16/cloudflare-%D0%BE%D1%82%D0%B...