그래서 내가하려는 것은 (B2의 S3 API를 통해) Backblaze B2 버킷에서 HLS m3u8 파일을 재생하는 것입니다. 내가 가진 문제는 HLS 파일이 .m3u8 파일이 재생해야하는 부분 인 모든 .ts 파일을 추적하는 .m3u8 파일로 구성되어 있다는 것입니다. 그래서 내가 가진 문제는 .m3u8 파일을 HTML 비디오 태그에 넣을 때 HLS 파일이 호환되는 브라우저, 즉 Google 크롬에서도 아무 일도 일어나지 않는다는 것입니다.
다른 유사한 질문을 확인했지만 ts 파일이 항상 누락되어 있기 때문에 작동하지 않는 것 같습니다.
문제는 .ts 파일이 없다는 것을 알고 있지만 내 웹 서버에서 파일을 참조하는 방법에 대한 단서도 없습니다. HTML 비디오 태그에서 HLS 파일과 모든 부분을 어떻게 든 재생할 수있는 방법이 있습니까?
내 현재 코드는 다음과 같습니다.
<video width="1920" height="1080" controls>
<source src="https://f002.backblazeb2.com/file/ARandomBucket/index.m3u8" type="application/x-mpegURL">
Your browser does not support the video tag.
</video>
좋아, video.js + video.js http 스트리밍을 사용하여 내 문제에 대한 해결책을 찾았습니다.
다음으로 video.js와 플러그인을 사용하여 모든 주요 브라우저에 대한 hls 스트리밍 용 플러그인을 사용했습니다. 둘 다 각각의 cdn에서 간단한 스크립트 태그가 필요합니다.
필요한 문서는 https://videojs.com/getting-started/ 및 여기 : https://github.com/videojs/http-streaming 에서 찾을 수 있으며 서로 다른 기능을 수행하므로 둘 다 필요합니다. 그래서 내가 찾은 코드는 내 경우에 마침내 작동합니다.
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>My Video</title>
<link href="https://vjs.zencdn.net/7.7.6/video-js.css" rel="stylesheet" />
<!-- For IE8 (for Video.js versions prior to v7)
<script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script>
-->
</head>
<body>
<h1>My Video</h1>
<video-js id="my_video_1" class="vjs-default-skin" controls preload="auto" width="640" height="268">
<source src="https://f002.backblazeb2.com/file/ARandomBucket/index.m3u8" type="application/x-mpegURL">
</video-js>
<!--This is for Video.js by itself -->
<script src="https://unpkg.com/video.js/dist/video.js"></script>
<!--This is for HLS compatibility with all major browsers-->
<script src = "https://unpkg.com/browse/@videojs/[email protected]/dist/videojs-http-streaming.min.js"></script>
<script>
var player = videojs('my_video_1');
</script>
</body>
</html>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다