Firefox and Chrome browsers are not able to play .m3u8 videos unless CORS (Cross-Origin Resource Sharing) is enabled on the video hosting server.

When m3u8 videos are hosted on a server, then the response of the videos should be allowed to be consumed on other web domains (MAZ's sub-domain in our case). If the videos are not allowed to be consumed on other web domains, m3u8 videos can’t be played by the Chrome & Firefox browsers.

To allow other domains to consume m3u8 videos, the server that hosts those videos needs to allow cross-origin requests.

Cross-origin resource sharing (CORS) is a browser mechanism that enables controlled access to resources located outside of a given domain. CORS allows servers to specify who (i.e., which origins) can access the assets on the server, among many other things.

This problem can be fixed by enabling CORS on the server that hosts the m3u8 videos.

By default, web browsers do not allow websites to make cross-origin requests in certain security-sensitive situations. To tell browsers to allow cross-origin requests to a site that belongs to you, you can use cross-origin resource sharing (CORS).

Cross-origin requests, also known as cross-site requests, occur when a web page on one domain makes requests to URLs on a different domain.

You can enable sending CORS headers from your app by adding the following in a .htaccess file in your app's web root directory (public):

The above example tells browsers that requests originating from web pages at https://example.com should be trusted. Just replace https://example.com with the sub-domain you see in the setup form of your Web channel in MAZ dashboard.