Integration Guide

Overview

The Polyv audio player is an important supplement to the Polyv Cloud Video-on-Demand Web Player, primarily used in audio-focused business scenarios. It is based on HTML5 for PC/mobile compatibility and deeply integrates with Polyv's video cloud services, such as supporting encrypted playback, providing users with simple, fast, secure, and stable playback services.

Basic Features

1. Supports playing audio and video files uploaded to the Polyv platform, including encrypted audio and video files.
2. Playback controls (play, pause, drag progress adjustment, etc.).
3. Two default skins available, with support for custom styles.

Format Support

• Audio formats: mp3, aac, m3u8
• Audio codecs: mp3, aac
• Video formats: mp4, m3u8
• Video codecs: h264

Note:

1. If the default transcoding method is set when uploading files, all files will be transcoded into video files. When using the audio player to play video files, only the audio will be heard, with no video displayed.
2. If "Source File Playback" is set when uploading files, the platform will not transcode the source file, and the player will play the source file directly. It is recommended to upload files in mp3 or aac format. Whether other audio formats, such as 3gp, ogg, wav, FLAC, mov, etc., can play normally depends on browser support.
3. If "Generate Audio File" is set when uploading video files, the platform will additionally transcode an mp3 file during transcoding, and the audio player will play that mp3 file.

Compatibility

Common compatibility issues:

1. Setting autoplay=true is ineffective; playback will not start automatically.
   • Audio autoplay is always prohibited in mobile browsers. The common workaround is to trigger playback manually via user interaction (e.g., listening for a user click event and calling the play method), though some specific browsers and webviews may allow autoplay.
   • On PC, Chrome 55+ and macOS High Sierra Safari 11+ also restrict autoplay.
2. Volume adjustment (setVolume) is not supported on iOS and some Android browsers.
3. Playback speed control (setSpeed) is not supported on some mobile browsers, such as Android WeChat.

Integration Method

Import Resources

<!-- 指定版本 -->
<script src="//player.polyv.net/resp/vod-audio-player/0.1.2/audio-player.min.js"></script>
<!-- 最新版本 -->
<script src="//player.polyv.net/resp/vod-audio-player/latest/audio-player.min.js"></script>

Create HTML Node

<div id="myAudioPlayer"></div>

Create Player Instance

const plvAudioPlayer = new PlvAudioPlayer({
  vid: '从 polyv 后台获取的 vid',
  wrap: '#myAudioPlayer',
  skin: 'white'
});

Run Online

Listen to Player Events

// 播放器初始化完毕
plvAudioPlayer.on('ready', function() {
  console.info('ready');
});

Call Player Methods and Access Player Properties

// 切换加密视频
plvAudioPlayer.changeVid({
  ts: ts,
  sign: sign,
  vid: vid
});
// 获取音频文件当前播放进度
const currentTime = plvAudioPlayer.currentTime;