视频播放

视频服务提供了Web播放器及移动端(iOS、Andriod)播放器SDK。

1. 播放工具

1.1 Web 播放器

Web播放器有Flash、HTML5及自适应模式。

支持格式:

  • Flash 模式:

    • 视频格式: mp4、flv、m3u8、rtmp、mp3
    • 视频编码: H.264
    • 音频编码: AAC、MP3
  • HTML5 模式:

    • 视频格式: mp4、m3u8
    • 视频编码: H.264
    • 音频编码: AAC

      m3u8格式播放依赖调用端浏览器支持情况:iOS全系列支持,Android 4.0及以上版本支持。

Web 播放器在线定制请访问此地址

详细定制说明请访问Web可定制播放器使用说明

示例代码

自适应模式

<!doctype html>
<html>
    <meta http-equiv=Content-Type content="text/html;charset=utf-8">
      <link rel="stylesheet" type="text/css"
          href="//g.alicdn.com/de/prismplayer/1.4.10/skins/default/index-min.css">
    <script src="//g.alicdn.com/de/prismplayer/1.4.10/prism-min.js"></script>
    <script>
    function InitPlayer(){
    var player = new prismplayer({
        id: "J_prismPlayer",    // 容器id
        source: "http://cloud.video.taobao.com/play/u/2554695624/p/1/e/6/t/1/fv/102/28552077.mp4",  // 视频url 支持互联网可直接访问的视频地址
        autoplay: true,       // 自动播放
        width: "100%",        // 播放器宽度
        height: "400px"      // 播放器高度
    });
    }
    </script>
<head>
<title>自适应播放器示例</title>
</head>
<body> 
<div id='J_prismPlayer' class='prism-player'></div>
<script type="text/javascript">InitPlayer()</script></body>
</html>

Flash 模式

<!doctype html>
<html>
    <meta http-equiv=Content-Type content="text/html;charset=utf-8">
      <link rel="stylesheet" type="text/css"
          href="//g.alicdn.com/de/prismplayer/1.4.10/skins/default/index-min.css">
    <script src="//g.alicdn.com/de/prismplayer/1.4.10/prism-flash-min.js"></script>
    <script>
    function InitPlayer(){
    var player = new prismplayer({
        id: "J_prismPlayer",    // 容器id
        source: "http://cloud.video.taobao.com/play/u/2554695624/p/1/e/6/t/1/fv/102/28552077.mp4",  // 视频url 支持互联网可直接访问的视频地址
        autoplay: true,       // 自动播放
        width: "100%",        // 播放器宽度
        height: "400px"      // 播放器高度
    });
    }
    </script>
<head>
<title>Flash播放器示例</title>
</head>
<body> 
<div id='J_prismPlayer' class='prism-player'></div>
<script type="text/javascript">InitPlayer()</script></body>
</html>

HTML 5 模式

<!doctype html>
<html>
    <meta http-equiv=Content-Type content="text/html;charset=utf-8">
    <link rel="stylesheet" type="text/css" href="//g.alicdn.com/de/prismplayer/1.4.10/skins/default/index-min.css">
    <script src="//g.alicdn.com/de/prismplayer/1.4.10/prism-h5-min.js""></script>
    <script>
        function InitPlayer(){
            var player = new prismplayer({
                id: "J_prismPlayer",    // 容器id
                source: "http://cloud.video.taobao.com/play/u/2554695624/p/1/e/6/t/1/fv/102/28552077.mp4",  // 视频url 支持互联网可直接访问的视频地址
                autoplay: true,       // 自动播放
                width: "100%",        // 播放器宽度
                height: "400px"      // 播放器高度
            });
        }
    </script>
<head>
<title>Html5播放器示例</title>
</head>
<body> 
<div id='J_prismPlayer' class='prism-player'></div>
<script type="text/javascript">InitPlayer()</script></body>
</html>

1.2. 移动端播放器SDK

支持格式:

  • 视频格式: mp4、flv、m3u8,rtmp
  • 视频编码: H.264
  • 音频编码: AAC

媒体播放器SDK参考手册

媒体播放器SDK及示例

2. 播放服务端设置

2.1. M3U8播放

使用Flash播放器在线播放M3U8文件,需要在M3U8文件所在Bucket根目录下放置crossdomain.xml文件,文件中包含Flash播放器所在域名,否则无法播放。

使用点播控制台预览您的M3U8文件,请在该M3U8文件所在Bucket根目录下放置如下内容的crossdomain.xml文件:

<?xml version="1.0" encoding="UTF-8"?>
<cross-domain-policy xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="http://www.adobe.com/xml/schemas/PolicyFile.xsd">
<allow-access-from domain="g.alicdn.com"/>
</cross-domain-policy>

其中 g.alicdn.com 是阿里云Web播放器所在的域名,如您使用其他的Flash播放器,将播放器所在的域名添加一条新的allow-access-from domain记录即可。

2.2. 拖拽播放

MP4、FLV 拖拽播放需要在点播加速域名属性中开启拖拽播放功能。

results matching ""

    No results matching ""