How to play MPEG-TS in chrome

Question

I have a video in which I want to show the user ( 'the' user because he can access Chrome PC or Chrome android).

If it's possible it would have nice to use html5 tags, but since it TS it can't...

So, I need a better suggest on how could I play them rather then open vlc and copy&past the file path. But that's terrible idea...

I saw this library which add VLC protocol ( vlc:// links ), but I prefer to use server side solutions.

I uploaded an example file in which you could see here.

I don't want to convert all the files into another format.

Edit: If someone comes here in future, after take @szatmary advice, there are some projects on GitHub who do it, however I can't use any of them without partially convert ( in a manner ), and since i'm working with extremely big files (10G+) and extremely weak computer ( Single 1.8 Cpu core ) I manage to display the audio only, not a real solution, but covers my needs.

score 6 · Accepted Answer · answered Aug 22 '17 at 17:46

6

Convert the file to mp4. If the ts file is h.264+aac, you can convert to fmp4 in javascript and play via media source extensions, but that is A LOT of code to get working.

answered Aug 22 '17 at 17:46

szatmary

28,669
7
42
56

score 0 · Answer 2 · answered Aug 06 '19 at 03:14

You can play the ts directly with index m3u8 file, if not you can make the m3u8 file, which is just the index of the ts file.

Some browser like edge you directly play ts. Refer to this answer

<video width="352" height="198" controls>
    <source src="index.m3u8" type="application/x-mpegURL">
</video>

For other browser like firefox and chrome, you need to feed the ts to video with js something like video.js,

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>videojs-contrib-hls embed</title>

  <link href="https://unpkg.com/video.js/dist/video-js.css" rel="stylesheet">
  <script src="https://unpkg.com/video.js/dist/video.js"></script>
  <script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>

</head>
<body>
  <h1>Video.js Example Embed</h1>

  <video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268" 
  data-setup='{}'>
    <source src="index.m3u8" type="application/x-mpegURL">
  </video>

  <script>
  </script>

</body>
</html>

Apart from playing the ts file, you also can convert it to mp4.

You can use pipe these ts files in to ffmpeg and output the mp4 file.

cat *.ts | ffmpeg -i pipe: -c:a copy -c:v copy output.mp4

or If you ts file name not have order,

grep .*.ts index.m3u8 | xargs cat | ffmpeg -i pipe: -c:a copy -c:v copy output.mp4

How to play MPEG-TS in chrome

2 Answers2