I've setup videojs player and got an HLS stream to work through OBS to the player. When OBS is running and sending video to the stream the play button appears on the player and it looks normal but when nothing is being streamed to the page it comes up with the "The media could not be loaded, either because the server or network failed or because the format is not supported." error with the cross underneath it. This would not be an issue to me but the page is going to be in use by other people and I don't want to have to repeat myself that the webpage is not broken and its just because it isn't streaming at the moment.
Is there a way to either hide the error or change the text on the error to notify the stream is not currently running. Also is there a way I can get it to autoplay when the stream turns on. Heres my current file which is very basic and just the player at the minute.
    <!DOCTYPE html>
  2 <html lang="en">
  3 <head>
  4     <meta charset=utf-8 />
  5     <title>Video.js | HTML5 Video Player</title>
  6     <link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
  7 </head>
  8 <body>
  9
 10   <video-js id="example_video_1" class="vjs-default-skin" controls preload="auto" width="640" height="264">
 11     <source src="http://localhost/live/webcam/index.m3u8" type="application/x-mpegurl">
 12     <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that <    a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p>
 13   </video-js>
 14
 15   <script src="https://unpkg.com/video.js/dist/video.js"></script>
 16   <script src="https://unpkg.com/@videojs/http-streaming/dist/videojs-http-streaming.js"></script>
 17
 18   <script>
 19           var player = videojs('example_video_1', {liveui: true});
 20   </script>
 21 </body>
 22
 23 </html>
Depending on what you want to do, you can call player.error() with null to tell Video.js to hide the error: player.error(null).
If you want to just disable errors, you can set errorDisplay option to be false in the player options:
var player = videojs('vid', {
  errorDisplay: false
});
Hope that helps.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With