Clever Geek Handbook

Streaming Hls Video on iOS / Safari

I am trying to stream hls to iOS Safari with Aframe which has three. js under the hood. But the video shows a black screen with audio playback. The src video is of type .m3u8. I tried to read many related posts but none of them have the correct solution. Is this some kind of desire to participate in HLS and WebGL in order to play on iOS? If not, can anyone help me with a solution.

Several discussions on issues that are available on github:

HLS m3u8 streaming video

HLS in Safari

+3


source to share


1 answer


To your question:

Is it some kind of wishful thinking that HLS and WebGL will play on iOS?

Yes, wishful thinking :-) Problem / problem / bug with Apple, not with any library. Regardless of the fact that JS-library A-Frame

, Three

etc. It will always be a problem for any browser on iOS (all browsers on iOS are essentially wrappers for Safari) and OSX Safari.

The problem is this (in my opinion):

  • At some point in the history of WebGL, there were restrictions on cross-content content (videos, images, etc.). I can't find a source for this, but I remember reading it somewhere, so it might not be 100% accurate.
  • Recently (a couple of years ago? 2015?), All major browsers have come to the conclusion that cross-user media for use in WebGL is safe. Except Apple / Safari.
  • For most browsers, an attribute crossorigin

    on an element <video>

    can signal that this content is coming from a different source. In Safari, this attribute is ignored or not implemented for some reason. It actually looks like WebKit, which Safari is based on, fixed it back in 2015 , but Apple still doesn't implement it. Even Apple refuses to comment on any progress .


Possible workarounds:

  • WebGL in Safari works with progressive (not streamed like HLS / Dash) videos .mp4

    . Browse any 360 Facebook video (website, not app) in iOS / Safari and you will notice that the source is .mp4

    .
  • Use HLS (or Dash), but play video without WebGL. Browse any 360 YouTube video (website, not an app) and I think they are using HLS or Dash, but the point is, they are streaming videos and Facebook is not.

Here's a good starting point for the real problem: link .

Here's another detailed thread: link .

+3


source






More articles:


All Articles