Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

Steady-Entertainment's avatar

open .m3u8 files with video-js

Dear community I wish you a happy new year,

I have a question for you.

I converted my video to an .m3u8 file successfully and stored it on a public disk.

https://i.imgur.com/aAksvvg.png

Now I want to play the .m3u8 file in my browser using videos js

        <video
    id="my-video"
    class="video-js"
    controls
    preload="auto"
    width="640"
    height="264"
{{--    poster="MY_VIDEO_POSTER.jpg"--}}
    data-setup="{}"
  >
    <source src="/videos/17.m3u8" type="application/vnd.apple.mpegurl" />
{{--    <source src="MY_VIDEO.webm" type="video/webm" />--}}

  </video>

for some reason the video is not beeing played back.

I heared something about an extra package to install to make this functionality available but then it states that this VHS package would already be avilable out of the box with video-js 7.x

https://github.com/videojs/http-streaming

I am confused how I can make this work

0 likes
7 replies
Tray2's avatar

m3u8 is a playlist and not an actual media format. In your case it seem to bee ts files. I'm not sure that they are playable in the browser. I suggest using mp4 instead.

Steady-Entertainment's avatar

I already managed to get it to work.

I just needed to reference the video-js scripts inside the blade view instead of insinde the head section.

I don't know why but now I have the youtube functionality I hoped for and it is working flawlessly

Tray2's avatar

Since blade is html and laravel php functionality you add the link to the js file just like you would in regular html.

<script src="<insert link here>"></script>
Steady-Entertainment's avatar

video-js 7.0 can open m3u8 playlists and decide based on the bandwith which quality of the playlit to pick and loads only the sections inside the stream its called VHS video-http-streaming

Please or to participate in this conversation.