html使用dplayer

置顶刘明同学呀

已于 2023-12-12 12:41:37 修改

阅读量242

点赞数

文章标签： html 前端

于 2023-11-28 12:55:01 首次发布

本文链接：https://blog.csdn.net/qq_40942490/article/details/134664831

版权

欢迎大家进群，一起探讨学习

欢迎大家进群，一起讨论学习

微信公众号，每天给大家提供技术干货

在这里插入图片描述

博主技术笔记 https://notes.xiyankt.com

博主开源微服架构前后端分离技术博客项目源码地址，欢迎各位star https://gitee.com/bright-boy/xiyan-blog

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,minimum-scale=1,user-scalable=no">
		<script src="https://cdn.bootcdn.net/ajax/libs/dplayer/1.27.1/DPlayer.min.js"></script>
		<script src="https://cdn.bootcdn.net/ajax/libs/hls.js/1.4.12/hls.js"></script>
		<script src="https://cdn.bootcdn.net/ajax/libs/flv.js/1.6.2/flv.js"></script>
		<script src="https://cdn.bootcdn.net/ajax/libs/dashjs/4.7.1/dash.all.min.js"></script>
		<script src="https://cdn.bootcdn.net/ajax/libs/shaka-player/4.4.1/shaka-player.compiled.debug.externs.min.js">
		</script>
	</head>
	<body>
		<div id="dplayer" style="width: 100%;height:250px"></div>
		<script>
			const dplayer = new DPlayer({
				container: document.getElementById('dplayer'),
				live: true,
				screenshot: true,
				playbackSpeed:[0.5, 1, 1.5, 2],
				video: {
					pic: "https://wimg.588ku.com/gif620/20/04/23/79a7882dfb0c59497976fd8b3bfe60ef.gif",
					url: "https://kgq-out1-0605.speedzonerc.com/live/hd-zh-2-3735845.m3u8?auth_key=1701136727-0-0-c1eb14e12277bc1c101fb5a032b62df9"
				},
			});
		</script>
	</body>
</html>