the user uploaded a video in ts format. After the upload is successful, I need to make the video display on the page and play it back. HTML5 doesn"t seem to support video playback in ts format? Ask for advice on how to deal with it
the user uploaded a video in ts format. After the upload is successful, I need to make the video display on the page and play it back. HTML5 doesn"t seem to support video playback in ts format? Ask for advice on how to deal with it
I do online TV ads upload background, the video format is ts, need to preview in web. The method is to convert the back end to m3u8 format, return the file path, and play it at the front end.
safari supports m3u8.
chrome uses this to play ideojs.github.io/videojs-contrib-hls/" rel=" nofollow noreferrer "> http://videojs.github.io/vide.
looks like this in html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>video</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>
<video id="my_video_1" class="video-js vjs-default-skin" controls preload="auto" width="640" height="268"
data-setup='{}'>
<source src="https://d2zihajmogu5jn.cloudfront.net/bipbop-advanced/bipbop_16x9_variant.m3u8" type="application/x-mpegURL">
</video>
</body>
</html>
start a local service with node, and the access is successful.
var express = require('express');
var app = express();
app.use(express.static(__dirname ));
app.listen(4004); using ffmpeg, you can convert mp4 videos into m3u8 files and a bunch of ts files, so in turn, as long as the ts files are encapsulated into m3u8, and then the m3u8 is converted to mp4, you can put them directly into the video tag.
ffmpeg-I your m3u8 address-acodec copy-vcodec copy-f mp4 output.mp4
is a playlist.m3u8 file with output001.ts to output142.ts in the same directory
-sharpEXTM3U
-sharpEXT-X-VERSION:3
-sharpEXT-X-MEDIA-SEQUENCE:0
-sharpEXT-X-ALLOW-CACHE:YES
-sharpEXT-X-TARGETDURATION:15
-sharpEXTINF:11.093667,
output000.ts
-sharpEXTINF:9.633711,
output001.ts
-sharpEXTINF:10.093756,
output002.ts
-sharpEXTINF:14.889711,
output003.ts
-sharpEXTINF:8.925756,
output004.ts
...
output139.ts
-sharpEXTINF:6.006744,
output140.ts
-sharpEXTINF:12.011667,
output141.ts
-sharpEXTINF:7.382700,
output142.ts
-sharpEXT-X-ENDLIST