将MP4文件在网页端播放

最新推荐文章于 2025-01-10 10:17:51 发布

Nemophilist_

最新推荐文章于 2025-01-10 10:17:51 发布

阅读量1.9k

点赞数

本文链接：https://blog.csdn.net/ALF2333/article/details/105245705

版权

本文介绍了如何在网页端播放MP4文件，主要涉及的技术包括nginx服务器的Windows安装部署，以及GMPullerX和VLC的使用，提供了一个详细的步骤教程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

需要用到的工具：nginx、GMPullerX、vlc
https://www.cnblogs.com/taiyonghai/p/9402734.html
[nginx Windows详细安装部署教程，转载]
在这里插入图片描述

<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<title>video.js</title>
<meta charset="utf-8">
<link href="https://unpkg.com/video.js@6.11.0/dist/video-js.min.css" rel="stylesheet">
<style>
.video-div {
	float: left;
}
</style>
</head>
<body>
	<div>
		<button type="button" οnclick="javascript:p(1)">视频1</button>
	</div>
	<div class="video-div">
		<video id="player1" class="video-js" controls>
			<source src="" type="application/x-mpegURL" id="video">
			<p class="vjs-no-js">not support</p>
		</video>
	</div>
</body>
</html>
<!-- <script type="text/javascript" src="../../../assets/global/plugins/jquery.min.js"></script> -->
<!--<script type="text/javascript" src="jquery.min.js"></script>-->
<script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script src="https://unpkg.com/video.js@6.11.0/dist/video.min.js"></script>
<script src="https://unpkg.com/videojs-flash/dist/videojs-flash.js"></script>
<script src="https://unpkg.com/videojs-contrib-hls/dist/videojs-contrib-hls.js"></script>

<script type="text/javascript">
	var player = videojs('player1', {width : 400,heigh : 200});
	function playUrl(url){
		player.src({src: url, type: "application/x-mpegURL"});
		player.play();
	}
	function p(n){
		var url="";
		if(n==1) url="http://192.168.0.21:9998/hls/1000.m3u8";
		playUrl(url);
	}
</script>

出现这样的问题,可能是跨域问题，暂时还不知道该怎么解决。