├── .gitignore
├── src
├── ffmpeg.js
├── client.html
└── app.js
├── package.json
└── README.md
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
--------------------------------------------------------------------------------
/src/ffmpeg.js:
--------------------------------------------------------------------------------
1 | const ffmpeg = require('fluent-ffmpeg');
2 | const ffmpegInstaller = require('@ffmpeg-installer/ffmpeg');
3 |
4 | ffmpeg.setFfmpegPath(ffmpegInstaller.path);
5 |
6 | ffmpeg('videos/video.mp4', { timeout: 432000 }).addOptions([
7 | '-profile:v baseline',
8 | '-level 3.0',
9 | '-start_number 0',
10 | '-hls_time 10',
11 | '-hls_list_size 0',
12 | '-f hls'
13 | ]).output('videos/output.m3u8').on('end', () => {
14 | console.log('end');
15 | }).run();
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "express-hls-example",
3 | "version": "1.0.0",
4 | "description": "Express, HLS를 사용한 간단한 동영상 스트리밍 예제",
5 | "main": "app.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1"
8 | },
9 | "repository": {
10 | "type": "git",
11 | "url": "git+https://github.com/HoseungJang/express-hls-example.git"
12 | },
13 | "author": "HoseungJang",
14 | "license": "ISC",
15 | "bugs": {
16 | "url": "https://github.com/HoseungJang/express-hls-example/issues"
17 | },
18 | "homepage": "https://github.com/HoseungJang/express-hls-example#readme",
19 | "dependencies": {
20 | "@ffmpeg-installer/ffmpeg": "^1.0.20",
21 | "express": "^4.17.1",
22 | "fluent-ffmpeg": "^2.1.2",
23 | "hls-server": "^1.5.0"
24 | }
25 | }
26 |
--------------------------------------------------------------------------------
/src/client.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | HLS Player
7 |
8 |
9 |
10 |
11 |
12 |
31 |
32 |
33 |
--------------------------------------------------------------------------------
/src/app.js:
--------------------------------------------------------------------------------
1 | const app = require('express')();
2 | const fs = require('fs');
3 | const hls = require('hls-server');
4 |
5 | app.get('/', (req, res) => {
6 | return res.status(200).sendFile(`${__dirname}/client.html`);
7 | });
8 |
9 | const server = app.listen(3000);
10 |
11 | new hls(server, {
12 | provider: {
13 | exists: (req, cb) => {
14 | const ext = req.url.split('.').pop();
15 |
16 | if (ext !== 'm3u8' && ext !== 'ts') {
17 | return cb(null, true);
18 | }
19 |
20 | fs.access(__dirname + req.url, fs.constants.F_OK, function (err) {
21 | if (err) {
22 | console.log('File not exist');
23 | return cb(null, false);
24 | }
25 | cb(null, true);
26 | });
27 | },
28 | getManifestStream: (req, cb) => {
29 | const stream = fs.createReadStream(__dirname + req.url);
30 | cb(null, stream);
31 | },
32 | getSegmentStream: (req, cb) => {
33 | const stream = fs.createReadStream(__dirname + req.url);
34 | cb(null, stream);
35 | }
36 | }
37 | });
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # express-hls-example
2 |
3 | Express와 HLS로 동영상을 스트리밍하는 예제입니다.
4 |
5 | This is an example that stream video using HLS and Node.js
6 |
7 | ## 참조
8 |
9 | 예제에 대해 설명한 블로그 글 입니다. 한국어와 영어 중 하나로 보실 수 있습니다.
10 |
11 | The links below are my blog posts that explain about this example. You can choose between Korean and English.
12 |
13 | [Node.js, Express, HLS로 동영상 스트리밍하기 (한국어)](https://medium.com/@HoseungJang/node-js-express-hls%EB%A1%9C-%EB%8F%99%EC%98%81%EC%83%81-%EC%8A%A4%ED%8A%B8%EB%A6%AC%EB%B0%8D%ED%95%98%EA%B8%B0-46006408a0e6)
14 |
15 | [Video Streaming with Node.js / HLS (English)](https://medium.com/@HoseungJang/video-streaming-with-node-js-9401213a04e7)
16 |
17 | ## 시작하기
18 |
19 | 저장소를 클론해주세요.
20 |
21 | Clone this repository.
22 |
23 | ```
24 | git clone https://github.com/HoseungJang/express-hls-example.git
25 | ```
26 |
27 | 의존성을 설치해주세요.
28 |
29 | Install dependencies.
30 |
31 | ```
32 | cd express-hls-example
33 | npm install
34 | ```
35 |
36 | src 디렉토리로 이동해주세요.
37 |
38 | Go to 'src' directory.
39 |
40 | ```
41 | cd src
42 | ```
43 |
44 | videos 디렉토리를 생성한 후 mp4 형식의 동영상을 넣어주세요.
45 |
46 | 동영상 파일의 이름은 video로 해주세요.
47 |
48 | 여기까지 오셨다면 src 디렉토리 내부가 아래와 같을 것입니다.
49 |
50 | After making 'videos' directory, Put 'video.mp4' file into there.
51 |
52 | If you complete this step, 'videos' directory is composed of:
53 |
54 | ```
55 | /src
56 | /videos
57 | video.mp4
58 | app.js
59 | client.html
60 | ffmpeg.js
61 | ```
62 |
63 |
64 |
65 | ffmpeg.js를 실행해주세요.
66 |
67 | Run ffmpeg.js.
68 |
69 | ```
70 | node ffmpeg.js
71 | ```
72 |
73 | end가 출력되면 ffmpeg.js를 종료하고 app.js를 실행해주세요.
74 |
75 | Terminate ffmpeg.js and Run app.js when 'end' is logged.
76 |
77 | ```
78 | node app.js
79 | ```
80 |
81 |
82 |
83 | localhost:3000으로 접속하고, 동영상을 재생해보세요.
84 |
85 | F12를 누르고 Network 탭도 확인해보세요.
86 |
87 | Now go to localhost:3000 and play your video.
88 |
89 | Press F12 key and check the Network tab.
90 |
--------------------------------------------------------------------------------