使用指南

更新时间：2022-04-22

本章以播放器 Web SDK v2.1.1版本为例，适用于源视频文件存于BOS、VOD及HLS/RTMP直播等场景，对于FLV直播，请您在初始化播放器（即调用setup方法）时，添加配置参数'isLive: true'。

登录百度智能云官网。
- 未注册，须先注册。
- 已注册，直接登录。
获取AK 为播放器鉴权做准备。

播放器鉴权将保证您在正式授权的前提下正常使用播放器的各项功能。百度智能云通过验证AK 的方式进行签名授权。若未经授权，播放过程中会显示警告消息。

搭建 Web 服务器。

此处以 Ubuntu 操作系统上搭建 Apache 服务器为例。

# apt-get install apache2        //安装apache

# vim /etc/apache2/apache2.conf  //添加 ServerName localhost

# service apache2 restart        //启动apache服务

# chmod a+w /var/www/            //赋予当前用户写权限

切换到网站根目录并下载最新的播放器 Web SDK，新建部署目录后解压并安装。

# cd /var/www/html/              //切换到网站根目录
        
# wget https://sdk.bce.baidu.com/media-sdk/cyberplayer-4.1.6.1.zip

# unzip cyberplayer-4.1.6.1.zip

新建HTML播放页面。
```
# vi player.html
```

添加 AK 及播放源等完成播放页面的配置，配置方法有如下两种：

将 Web SDK 添加到 Web 页面

代码示例如下：

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>简单的html示例</title>
  </head>
  <body>
      <div id="playercontainer"></div>
      <!-- HEVC/H265 播放引入 missile.js -->
      <!-- <script type="text/javascript" src="./cyberplayer-4.1.6.1/missile.js"></script> HEVC/H265 播放引入 -->
      <script type="text/javascript" src="./cyberplayer-4.1.6.1/cyberplayer.js"></script>
      <script type="text/javascript">
          var player = cyberplayer("playercontainer").setup({
            hevc: false, // HEVC播放内核为 true
            width : 580,
            height : 433,
            backcolor : "#FFFFFF",
            stretching : "uniform",

            file : "<Media_Source_In_BOS_Bucket>",
            ak : "<AK>",
            autoStart : false,
            repeat : false,
            volume : 100,
            controls : "over"
          });
          </script>
  </body>
  </html>

JS 参数调用 Web SDK

代码示例如下：

  CTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <title>简单的html示例</title>
  </head>
  <body>

  <div id="aaa">
     <script type="text/javascript" src="./cyberplayer-4.1.6.1/cyberplayer.js?file=<Media_Source_In_BOS_Bucket>&width=680&autostart=true&volume=60&height=400&ak=<AK>&stretching=uniform&controls=true"></script>
  </div>
  </body>
  </html>

打开浏览器输入<WebServer>/player.html播放音视频。

播放器通过Javascript进行调用和集成，播放器SDK包含两个渲染引擎：Flash渲染引擎和HTML5渲染引擎，SDK能根据当前浏览器信息自动适配合适的播放器。当两种播放器都支持的情况下，SDK优先选择HTML5。

简介

开发指南

百度智能云

音视频处理 MCP

音视频处理 MCP

使用指南