<script src="https://wwwr.plaso.cn/static/sdk/js/plaso_upime_player-1.7.js" />

<link
  rel="stylesheet"
  href="https://wwwr.plaso.cn/static/sdk/css/plaso_upime_player-1.7.css"
/>

<script>
  let canPlay = false;
  let currentTime;
  let duration;
  let playing = false;

  const sdkPlayer = new PlasoUpimePlayer(document.getElementById("playerdiv"));
  sdkPlayer.setSrc(query);

  sdkPlayer.on("canplay", () => {
    canPlay = true;
    duration = sdkPlayer.duration; // canplay事件触发时才能获取到duration
    sdkPlayer.on("timeupdate", () => {
      // 监听timeupdate事件获取currentTime更新进度条长度，也可以自己设置定时器读取sdkPlayer.currentTime
      currentTime = sdkPlayer.currentTime;
      console.log("currentTime =", currentTime);
    });
    sdkPlayer.on("ended", () => {
      console.log("play end");
    });
  });

  // 播放
  function play() {
    if (!canPlay) {
      return;
    }
    if (sdkPlayer.ended) {
      sdkPlayer.currentTime = 0;
    }
    sdkPlayer.play().then(() => {
      playing = true;
    });
  }

  // 暂停
  function pause() {
    sdkPlayer.pause().then(() => {
      playing = false;
    });
  }

  // 快进 (单位s)
  function seekTo(time) {
    sdkPlayer.currentTime = time;
  }
</script>

https://wwwr.plaso.cn/static/sdk/styleupime/${SDK_VERSION}/?