Getting this working with nginx?

[DavidVentura]

I have two streams (high and low quality) with different resolutions. Using the standard nginx-rtmp configuration I'm able to see two "undefinedp" qualities in the player and switching between them shows request to the corresponding path (downloading /high/456.ts or /low/457.ts) but the player seems to be stuck buffering and the quality doesn't seem to change.

My m3u8 file is

#EXTM3U
#EXT-X-VERSION:3
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=40000,CODECS="mp4a.40.5"
movie_audio/index.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=240000
movie_low/index.m3u8
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=1000000
movie_high/index.m3u8

I noticed the ID is the same, but this is generated by nginx and seems normal

[leandromoreira]

can you provide a test stream link for us?

[DavidVentura]

Yes but it's not always up.. I'll leave it on for at least one hour now https://curso.especificosba.com.ar/hls/movie.m3u8

EDIT: also, playing this with mpv shows the correct tracks and lets me switch between them with no problem (including the no-video track)

mpv says:

     Video --vid=1 'bitrate 40000' (h264)
     Video --vid=2 'bitrate 240000' (h264)
 (+) Video --vid=3 'bitrate 1000000' (h264)
     Audio --aid=1 'bitrate 40000' (aac)
     Audio --aid=2 'bitrate 240000' (aac)
 (+) Audio --aid=3 'bitrate 1000000' (aac)

[leandromoreira]

@DavidVentura it's raising media error decode, try to use or follow this docker because this is working just fine. (I mean, use it (or see the examples) to generate your stream, double check your input).

[DavidVentura]

Can you test again/tell me how to test the stream? I've removed the audio-only stream

[leandromoreira]

@DavidVentura here it's working fine.

[DavidVentura]

I'm getting the (undefinedp) qualities on firefox and chromium..

My player is configured like this:

var player = new Clappr.Player(
                {   
                    source: "https://plataforma.especificosba.com.ar/hls/movie.m3u8",
                    plugins: {
                        'core': [LevelSelector]
                    },  
                    levelSelectorConfig: {
                        1: 'Audio',
                        2: 'Baja',
                        3: 'Alta'
                    },  
                    parentId: "#player",
                    autoPlay: true,
                    chromeless: false,
                    playbackNotSupportedMessage: 'blah',
                    poster:"https://curso.especificosba.com.ar/loading.jpg",
                    width:w,
                    height:h,
                    disableVideoTagContextMenu: true
                }); 

and I'm using

        <script type="text/javascript" src="https://cdn.jsdelivr.net/clappr/latest/clappr.min.js"></script>
        <script type="text/javascript" src="//cdn.jsdelivr.net/clappr.level-selector/latest/level-selector.min.js"></script>

[leandromoreira]

OHH @DavidVentura try to use the dist version of clappr instead of the CDN version (they some time take one week to update to the latest version)

[DavidVentura]

Now it works.. what has been fixed this week? Any way to change the bandwidth labels for user-friendly labels? IE "240kbps" => "LOW"

[leandromoreira]

yes, you can see that in the README :)

[DavidVentura]

I had forgotten the label: block as seen in my config earlier... thanks I'll close this one, but will keep trying to get the 'audio' one to work, for now with a 16x16px stream