阿里云Aliplayer播放器

快速入门

资源引用

version填入具体的版本号，例如2.3.5

不依赖于任何的前端js库，只需要在页面中引用如下js文件，就可以进行播放器的初始化：

http://g.alicdn.com/de/prismplayer/{version}/aliplayer-min.js

这个文件同时包含了Flash和Html5跨终端自适应的逻辑。如果您只是想使用其中一种播放技术，也可以只引用对应技术的js文件，从而获得更小的文件体积：

Flash版本:

http://g.alicdn.com/de/prismplayer/{version}/aliplayer-flash-min.js

Html5版本:

http://g.alicdn.com/de/prismplayer/{version}/aliplayer-h5-min.js

html5播放器，请额外引用css文件：

http://g.alicdn.com/de/prismplayer/{version}/skins/default/aliplayer-min.css

添加容器元素

请务必加上prism-player类名，此为h5播放器皮肤的钩子。

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

初始播放器

直接播放url实例

播放器可以通过初始化参数 source 传递视频的 url 直接进行播放

<body>
    <div id="J_prismPlayer" class="prism-player"></div>   <!-- prism-player为h5播放器皮肤的钩子类名，请务必加上 -->
    <script>
        var videoUrl=""; //获取的视频地址
        // 初始化播放器
        var player = new Aliplayer({
            id: "J_prismPlayer", // 容器id
            source: videoUrl,        // 视频url
            width: "100%",       // 播放器宽度
            height: "400px"      // 播放器高度
        },function(player){
          console.log('播放器创建了');
        });
    </script>
</body>

vid播放实例

通过设置视频vid和播放凭证playauth参数播放阿里云视频点播服务中托管的视频

如何接入点播服务

<body>
    //播放器容器
    <div id='J_prismPlayer' class='prism-player'>   <!-- prism-player为h5播放器皮肤的钩子类名，请务必加上 -->
    //播放器初始化代码
    <script>
          var player = new Aliplayer({
              id: "J_prismPlayer", // 容器id
              vid : '1e067a2831b641db90d570b6480fbc40',//媒体转码服务的媒体Id
              playauth : '',//播放鉴权 [playauth参照](https://help.aliyun.com/document_detail/52833.html?spm=5176.doc51236.6.627.5gm5gf)
              width: "640px",
              height: "480px"
          },function(player){
          console.log('播放器创建了');
        });
     </script>
</body>

直播实例

播放器初始化参数 isLive 设置为 true 时为直播模式,直播源支持 HLS、 Http Flv(Flash only)、RTMP(Flash only)

<body>
    //播放器容器
    <div id='J_prismPlayer' class='prism-player'>   <!-- prism-player为h5播放器皮肤的钩子类名，请务必加上 -->
    //播放器初始化代码
    <script>
          var liveurl="http://live-url";
          var player = new Aliplayer({
              id: "J_prismPlayer", // 容器id
              source: liveurl,//直播流url
              isLive:true,//设置为true时为直播状态
              width: "640px",
              height: "480px"
          },function(player){
          console.log('播放器创建了');
        });
     </script>
</body>