整合阿里云点播播放器

文档对应视频课程中5.1章节,请小伙伴们对应学习。

阿里云点播官方文档

Web播放器SDK使用

官方文档中提供了用户测试用例,按照用例中的代码整合到项目中就可以了。播放器支持4种播放模式,本课程只讲解前两种方式,视频地址直接播放和阿里云点播模式播放(只需要阿里云的videoId)

<!DOCTYPE html>
<html>
    <head>
     <meta charset="UTF-8">
     <meta name="viewport"   content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"/>
     <title>用户测试用例</title>
     <!--引入阿里云的css和js-->
     <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
     <script charset="utf-8" type="text/javascript" src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js"></script>
    </head>
    <body>
        <!--定义div,用来展示播放器,指定ID-->
        <div  class="prism-player" id="J_prismPlayer"></div>
        <script>
            //创建对象指定上面设置的ID,
            var player = new Aliplayer({
            id: 'J_prismPlayer',
            width: '100%',
            autoplay: true,
            //支持播放地址播放,此播放优先级最高
            source : '播放url',
            //播放方式二:点播用户推荐
            vid : '1e067a2831b641db90d570b6480fbc40',
            playauth : 'ddd',
            cover: 'http://liveroom-img.oss-cn-qingdao.aliyuncs.com/logo.png',
            encryptType:1, //当播放私有加密流时需要设置。
            //播放方式三:仅MPS用户使用
            vid : '1e067a2831b641db90d570b6480fbc40',
            accId: 'dd',
            accSecret: 'dd',
            stsToken: 'dd',
            domainRegion: 'dd',
            authInfo: 'dd',
            //播放方式四:使用STS方式播放
            vid : '1e067a2831b641db90d570b6480fbc40',
            accessKeyId: 'dd',
            securityToken: 'dd',
            accessKeySecret: 'dd',
             region:'cn-shanghai',//eu-central-1,ap-southeast-1
            },function(player){
                console.log('播放器创建好了。')
           });
        </script>
    </body>
</html>

results matching ""

    No results matching ""