clappr: m3u8 not working

<head>
  <script type="text/javascript" src="https://cdn.jsdelivr.net/gh/clappr/clappr@latest/dist/clappr.min.js"></script>
</head>

<body>
  <div id="player"></div>
  <script>
    var player = new Clappr.Player({source: "http://jiotv.live.cdn.jio.com/Star_Vijay/Star_Vijay_400.m3u8", parentId: "#player"});
  </script>
</body>

why is this code not working?

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 32 (8 by maintainers)

Most upvoted comments

some sneaky users are using this thread to spam illegal ways of sharing content. It’s sad to see people doing this shit here, I reported all usernames to github and I hope they will stop using clappr as a channel to spread their dirt. keep an eye out and help report these users! 😃

How to please help

@firofame you can use the flashls playback (as shown in the code below) but then you might have another issue which is related to crossdomain.xml file. Anyway, I think the service / CDN you use to stream must have the option to change HTTP response headers.

	var player = new Clappr.Player({
	  source: 'http://dev.example.me/hls/stream.m3u8',
	  baseUrl: 'dist',
	  poster: 'http://clappr.io/poster.png',
	  mute: true,
	  height: 360,
	  width: 640,
	  plugins: [Clappr.FlasHLS]
	});

is there any workaround CORS, since i dont have access to the server.

The very basic premise of this mechanism is to provide security to browser and users so I think you still can:

  • use a plugin (like flash)
  • use an extension (chrome extension)
  • host the files (m3u8, ts) and change http headers
  • move to another service / CDN which gives you this option

Php With 2 urls in different places string to one and Open it as page source !! How and code please?

Means URL+token(generated from 3sec)= URL?

@firofame it’s a security feature on the browsers, you must setup the CORS headers in your CDN / server (the nodes which serve your stream [.m3u8]), that’s why it works in the last example you provided:

screen shot 2017-08-04 at 8 04 58 pm

And when we try to play your content, the master playlist works fine but then the sub-playlists are without CORS.

screen shot 2017-08-04 at 8 08 55 pm screen shot 2017-08-04 at 8 09 29 pm

That one uses the same security.

Because your source has security to block requests from other websites, otherwise known as cross origin policy.