การนำสตรีมไปใช้งานในเว็บและแอพลิเคชัน
คุณสามารถนำ URL ในส่วนของ CDN Stream URL ซึ่งจะเป็น URL ที่ลงท้ายด้วย .m3u8 ไปใช้งานกับเว็บและแอพลิเคชันของคุณได้เลย
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="//byteark-sdk.cdn.byteark.com/player/v0.3.68/byteark-player.min.css">
</head>
<body>
<video id="video-player-element" class="video-js byteark-skin" width="854" height="480" controls playsinline webkit-playsinline></video>
<script src="//byteark-sdk.cdn.byteark.com/player/v0.3.68/byteark-player.min.js"></script>
<script>
var player = byteark('video-player-element', {
media: {
sources: [{
src: 'https://sample.cdn.byeark.com/fleetstream/live/playlist.m3u8',
type: 'application/x-mpegURL'
}],
},
});
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.jwplayer.com/libraries/aBCdE12G.js"></script>
</head>
<body>
<div id="video-player-element"></div>
<script type="text/JavaScript">
jwplayer('video-player-element').setup({
playlist: 'https://sample.cdn.byeark.com/fleetstream/live/playlist.m3u8'
});
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!doctype html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<video id="video-player-element" width="960" height="540" class="video-js vjs-default-skin" controls>
<source
src="https://sample.cdn.byeark.com/fleetstream/live/playlist.m3u8"
type="application/x-mpegURL">
</video>
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.7.5/video.js"></script>
<script>
var player = videojs('video-player-element');
player.play();
</script>
</body>
</html>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
WARNING
Video player ที่คุณใช้เล่นไลฟ์สตรีมจะต้องรองรับการเล่นวิดีโอที่ใช้ฟอร์แมต HTTP Live Streaming (HLS)
