HTML
<div id="real-time-transcode-body"></div>
引入js
<script type="text/javascript" charset="utf-8" src="//apaas.aodianyun.com/rtt/js/comment.js"></script>

配置选项
以下对下列方法的部分信息进行统一说明：
params
  实时转码调用该方法时固定传入的请求参数
  后端可视情况使用，前端可根据自身需要修改
  具体传入参数详见各方法体
success
  成功回调函数
  以规定格式的数据传入并执行success函数视为调用成功
  实时转码使用回传数据方能进行后续动作
  若后端返回的数据不符合要求格式，需在方法体内整理成正确格式后再传入success
  具体格式要求详见各方法体
  与error函数选择其一执行
error
  失败回调函数
  以字符串形式将错误信息传入并执行error函数视为调用失败
  实时转码将在界面上展示错误信息
  与success函数选择其一执行
方法的取舍
  实际使用中用到的方法需按照文档要求实现
  无需实现的方法则置空或者不传入均可
RTT对象中可使用的变量及方法
  RTT.STATIC_PROTOCOL  // 协议
  RTT.ROOT_HOST  // 根域名
  RTT.ParseUrl(key: string): string
      获取url的参数，例如：
      const token = RTT.ParseUrl("token");
/**
 * 获取图片列表
 * @param {*} params 请求参数 {page: 页码（number）, num: 一页数量（number）, classify: 分类id（string | number）}
 * @param {*} success 成功回调函数
 * @param {*} error 失败回调函数
 */
const getImageList = (params, success, error) => {
  // 举例说明
  // 将固定传入的params参数与额外需要的参数合并
  const token = RTT.ParseUrl("token");
  const data = {
    ...params,
    fileType: "image",
    token,
  };
  // 调用后端接口，可使用JQuery的ajax函数进行请求
  $.ajax({
    type: "POST",
    url: `后端接口`,
    data: JSON.stringify(data),
    contentType: "JSON",
    dataType: "JSON",
    async: false,
    success: function (res) {
      // 接收后端数据后可进行必要处理后通过success或error将结果反馈
      // success函数传参：
      /* {
        list: [ 资源列表，必传
          {
            id: string | number; id
            classify: string | number; 分类id
            title: string; 名称
            thumbnail: string; 缩略图
            url: string; 资源地址
          },
          ...
        ],
        total: number; 资源总数，用于列表的分页展示，可不传
      } */
      if (res.flag === 100) {
        success({ list: res.data, total: res.total });
      } else {
        error(res.flagString);
      }
    },
    error: function () {
      error("获取图片列表失败");
    },
  });
};
/**
 * 获取图片分类列表
 * @param {*} success 成功回调函数
 * @param {*} error 失败回调函数
 */
const getImageClassifyList = (success, error) => {
  // success函数传参：
  /* {
    list: [ 资源列表，必传
      {
        classify: string | number; 分类id
        name: string; 名称
      },
      ...
    ],
  } */
};
/**
 * 获取视频列表
 * @param {*} params 请求参数 {page: 页码（number）, num: 一页数量（number）, classify: 分类id（string | number）}
 * @param {*} success 成功回调函数
 * @param {*} error 失败回调函数
 */
const getVideoList = (params, success, error) => {
  // success函数传参：
  /* {
    list: [ 资源列表，必传
      {
        id: string | number; id
        classify: string | number; 分类id
        title: string; 名称
        thumbnail: string; 缩略图
        url: string; 资源地址
      },
      ...
    ],
    total: number; 资源总数，用于列表的分页展示，可不传
  } */
};
/**
 * 获取视频分类列表
 * @param {*} success 成功回调函数
 * @param {*} error 失败回调函数
 */
const getVideoClassifyList = (success, error) => {
  // success函数传参：
  /* {
    list: [ 资源列表，必传
      {
        classify: string | number; 分类id
        name: string; 名称
      },
      ...
    ],
  } */
};
/**
 * 获取音频列表
 * @param {*} params 请求参数 {page: 页码（number）, num: 一页数量（number）, classify: 分类id（string | number）}
 * @param {*} success 成功回调函数
 * @param {*} error 失败回调函数
 */
const getAudioList = (params, success, error) => {
  // success函数传参：
  /* {
    list: [ 资源列表，必传
      {
        id: string | number; id
        classify: string | number; 分类id
        title: string; 名称
        thumbnail: string; 缩略图
        url: string; 资源地址
      },
      ...
    ],
    total: number; 资源总数，用于列表的分页展示，可不传
  } */
};
/**
 * 获取音频分类列表
 * @param {*} success 成功回调函数
 * @param {*} error 失败回调函数
 */
const getAudioClassifyList = (success, error) => {
  // success函数传参：
  /* {
    list: [ 资源列表，必传
      {
        classify: string | number; 分类id
        name: string; 名称
      },
      ...
    ],
  } */
};
// 将配置写入RTT对象
RTT.Config({
  projectId: "1111", // 实时转码工程id，必传
  title: "自定义标签名称", // 浏览器标签title，可不传，默认为“实时转码”
  themeColor: "#1eb4ad", // 主题色，须为十六进制格式，可不传，默认为 #409eff
  getImageClassifyList,
  getImageList,
  getVideoClassifyList,
  getVideoList,
  getAudioClassifyList,
  getAudioList,
});
// 初始化
RTT.Init();