Before you begin, if you know Uzbek, you can continue in Uzbek.
This library is mainly focused on studying and downloading streams used by platforms like YouTube, Instagram, and Pinterest. The library is released for Frontend only!
Currently, if you provide a link to an .m3u8 file, the library will find and download the video with the largest size inside it. Note that audio and video are separate, as this library is designed for client-side use only. You can clone and enhance it if you wish.
For React, Vue, and Angular, simply installing it is enough!
yarn add video-stream-parserCurrently, only code for downloading m3u8 files is available!!!
import { M3U8 } from "video-stream-parser";
// You must provide the URL of the .m3u8 file!
const m3u8Url = "https://exmaple-cdn.com/hls/example_playlist.m3u8";
// Create an instance
const m3u8 = new M3U8(m3u8Url, { autoDownload: true });
m3u8
.on("progress", progress => {
console.log(progress.percentage);
})
.on("finished", finished => {
console.log(`Download finished`, finished.data);
})
.on("error", message => {
console.error(message);
})
.on("aborted", abortMessage => {
console.log(abortMessage);
});Of course, you can also use it with VanillaJS without any frameworks!
<script src="https://cdn.jsdelivr.net/npm/video-stream-parser@latest/lib/browser/bundle.iife.js"></script><script src="https://unpkg.com/video-stream-parser@latest/lib/browser/bundle.umd.js"></script>You only need to choose one of the CDN scripts above or below!
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>M3U8 Stream Download Page</title>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/video-stream-parser@latest/lib/browser/bundle.iife.js"></script>
<script>
// You must provide the URL of the .m3u8 file!
const m3u8Url = "https://exmaple-cdn.com/hls/example_playlist.m3u8";
// The M3U8 class is already attached to the window object!
const m3u8 = new M3U8(m3u8Url, { autoDownload: true });
m3u8
.on("progress", progress => {
console.log(progress.percentage);
})
.on("finished", finished => {
console.log(`Download finished`, finished.data);
})
.on("error", message => {
console.error(message);
})
.on("aborted", abortMessage => {
console.log(abortMessage);
});
</script>
</body>
</html>