阿里云Web播放器使用

最新推荐文章于 2024-08-08 11:36:40 发布

王等等csdn

最新推荐文章于 2024-08-08 11:36:40 发布

阅读量4k

点赞数

文章标签：前端阿里云播放器

本文链接：https://blog.csdn.net/qq_38475901/article/details/100030756

版权

本文介绍了如何在网页中集成阿里云Web播放器，包括引入2.8.2版本的css和js文件，创建播放器容器，以及初始化播放器的步骤。重点关注source和cover变量，它们分别用于设置播放内容的URL和封面图像。

摘要由CSDN通过智能技术生成

1. 在页面中引入css，js文件，当时最新版本是2.8.2

<link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
<script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js"></script>

2. 定义一个播放器容器

<div class="prism-player" id="myPlayer"></div>

3. 初始化Web播放器
其中source，cover是事先定义好的变量，及播放url和封面图

var player = new Aliplayer({
                    "id": "myPlayer",      //播放器外层容器的dom元素id
                    "source":source,     //视频播放地址url
                    "width": "100%",
                    "height": "300px",
                    "autoplay": false,