Wait for MEDIA_ATTACHED on loading HLS

[camelgod]

I'm letting you guys know I've had much more luck with reliability on loading HLS stream. @netpro2k

Replacing the XHR get method in loading HLS function (media-views.js) instead letting the media attach before trying to load the source:

hls.on(HLS.Events.MEDIA_ATTACHED, function() {
    hls.loadSource(url);
});

Using the standard HLS.Events allows me to also catch or make exceptions.

┆Issue is synchronized with this Jira Task

[johnshaughnessy]

@camelgod Are you able to provide a longer code snippet demonstrating the change? I'm not sure if I understand your suggestion correctly. Do you replace the entire xhrSetup or just wrap the loadSource call in the MEDIA_ATTACHED callback below it? https://github.com/mozilla/hubs/blob/master/src/components/media-views.js#L769

[camelgod]

@johnshaughnessy Sure, I don't use any XHR. Excuse me for copying an image instead of the actual code. The config we use is optimised to buffer from lowest to highest quality to increase load time stability + smaller fragments etc. Might not be optimal for all situations.

Also please note we just load BaseURL as we don't want to cors-proxy our stream. We find this makes stream more stable overall.

[mcfiredrill]

@camelgod Do you have a fork of this change up anywhere by chance? I wonder if this would fix my issue https://github.com/mozilla/hubs/issues/3881

[camelgod]

@mcfiredrill Hey! No forks public yet, but all the code you need is in the screenshot above, that goes in media-views. You can just try to copy it and see if it fixes your issue. I also avoid using HLS streams through Reticulum to get the proper CDN (if you use one) and quality based on network bandwidth for the user.

[mcfiredrill]

@camelgod I've tried, but it seems the code has changed a bit since then.... Does anyone know if there's a way to bypass the Reticulum proxy so my stream will work?