网页中应用m3u8格式的视频（video.js）
m3u8格式视频应用到页面中的代码，以下请参考：
DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><title>前端播放m3u8格式视频title><link href="https://vjs.zencdn.net/7.4.1/video-js.css" rel="stylesheet"><script src='https://vjs.zencdn.net/7.4.1/video.js'>script><script src="https://cdn.bootcdn.net/ajax/libs/videojs-contrib-hls/5.15.0/videojs-contrib-hls.min.js">script>
head><body>
<style>.video-js .vjs-tech {position: relative !important;}
style>
<div><video id="myVideo" class="video-js vjs-default-skin vjs-big-play-centered" controls preload="auto" data-setup='{}' style='width: 60%;height: auto'><source id="source" src="http://1252093142.vod2.myqcloud.com/4704461fvodcq1252093142/48c8a9475285890781000441992/playlist.m3u8" type="application/x-mpegURL">source>video>
div>
body>
<script>// videojs 简单使用var myVideo = videojs('myVideo', {bigPlayButton: true,textTrackDisplay: false,posterImage: false,errorDisplay: false,})myVideo.play()// 视频播放myVideo.pause() // 视频暂停var changeVideo = function (vdoSrc) {if (/\.m3u8$/.test(vdoSrc)) { //判断视频源是否是m3u8的格式myVideo.src({src: vdoSrc,type: 'application/x-mpegURL' //在重新添加视频源的时候需要给新的type的值})} else {myVideo.src(vdoSrc)}myVideo.load();myVideo.play();}// var src = 'http://1252093142.vod2.myqcloud.com/4704461fvodcq1252093142/f865d8a05285890787810776469/playlist.f3.m3u8';// document.querySelector('.qiehuan').addEventListener('click', function () {// changeVideo(src);// })
script>
html>
本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！