video plays in Safari but not in Firefox and Opera

[PAOK1926]

Description

My video plays in Safari but not in Firefox and Opera.
in Firefox i get the message "The media could not be loaded, either because the server or network failed or because the format is not supported."
in Opera, tries to start but it doesn't. In Firefox mobile, starts but stops immediately.
my page is here: http://mypaok.xyz/test.html

and this is the html code:
`

<script src="//vjs.zencdn.net/8.18.1/video.min.js"></script>

`

when i try to open the stream link http://gate1.mypaok.xyz:8081/hls/paok.m3u8 with VLC plays normally..

can anyone help me ?

Reduced test case

http://mypaok.xyz/test.html

Steps to reproduce

1. try to open with Safari
2. then with firefox
3. then with opera

Errors

No response

What version of Video.js are you using?

8.18.1

Video.js plugins used.

No response

What browser(s) including version(s) does this occur with?

firefox all, opera all

What OS(es) and version(s) does this occur with?

macos 13.4

[welcome]

👋 Thanks for opening your first issue here! 👋

If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.
To help make it easier for us to investigate your issue, please follow the contributing guidelines.

[mister-ben]

The browser logs a message to the console which tells you: "Access to XMLHttpRequest at 'http://gate1.mypaok.xyz:8081/hls/paok.m3u8' from origin 'http://mypaok.xyz' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource."

Safari playing native does not need CORS headers.

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
https://enable-cors.org

[PAOK1926]

The browser logs a message to the console which tells you: "Access to XMLHttpRequest at 'http://gate1.mypaok.xyz:8081/hls/paok.m3u8' from origin 'http://mypaok.xyz' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource."

Safari playing native does not need CORS headers.

https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS https://enable-cors.org

hello and thank you for the prompt response...

i added
add_header Access-Control-Allow-Origin *;
in my nginx configuration, and now stream plays in Firefox. But it doesnt in Opera..

[yashwantklimb]

need to ensure we have options.plugins.record.videoMimeType = 'video/webm; codecs=vp8' here codecs to be vp8 as firefox dont support vp9 it seems which seems to be default.

  $scope.videoQuestion.player = videojs('myVideo', options);