# APlayer

**Repository Path**: chuangyeba/aplayer

## Basic Information

- **Project Name**: APlayer
- **Description**: APlayer是一个开源音乐播放器项目，支持多种音频格式和在线流媒体，提供简洁的用户界面和强大的自定义功能。
- **Primary Language**: JavaScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-04-28
- **Last Updated**: 2026-04-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

<h1 align="center">APlayer</h1>

> Wow, such a lovely HTML5 music player

[![npm](https://img.shields.io/npm/v/aplayer.svg?style=flat-square)](https://www.npmjs.com/package/aplayer)
[![npm](https://img.shields.io/npm/l/aplayer.svg?style=flat-square)](https://github.com/MoePlayer/APlayer/blob/master/LICENSE)
[![Gitee](https://img.shields.io/badge/Gitee-chuangyeba%2Faplayer-red?style=flat-square)](https://gitee.com/chuangyeba/aplayer)

## Introduction

![image](https://www.yuntts.com/wp-content/themes/360mb-v5/assets/images/logo/logo.png)

APlayer is a lovely HTML5 music player.

**APlayer supports:**

- Media formats - MP4 H.264 (AAC or MP3) - WAVE PCM - Ogg Theora Vorbis
- Features - Playlist - Lyrics - Download

## Install

```bash
npm install aplayer
```

## Usage

```html
<link rel="stylesheet" href="APlayer.min.css">
<div id="aplayer"></div>
<script src="APlayer.min.js"></script>
```

```javascript
const ap = new APlayer({
    container: document.getElementById('aplayer'),
    mini: false,
    autoplay: false,
    theme: '#FADFA3',
    loop: 'all',
    order: 'random',
    preload: 'auto',
    volume: 0.7,
    mutex: true,
    listFolded: false,
    listMaxHeight: 90,
    download: true,
    lrcType: 3,
    audio: [{
        name: 'name',
        artist: 'artist',
        url: 'url.mp3',
        cover: 'cover.jpg',
        lrc: 'lrc.lrc',
        theme: '#ebd0c2'
    }]
});
```

## Options

| Name | Default | Description |
|------|---------|-------------|
| container | document.querySelector('.aplayer') | player container |
| mini | false | mini mode |
| autoplay | false | autoplay |
| theme | '#b7daff' | theme color |
| loop | 'all' | player loop play modes, values: 'all', 'one', 'none' |
| order | 'list' | player play order, values: 'list', 'random' |
| preload | 'auto' | values: 'none', 'metadata', 'auto' |
| volume | 0.7 | default volume, playback will be muted if the value is 0 |
| mutex | true | pause other players when this player is playing |
| lrcType | 0 | lrc type, values: 1, 2, 3 |
| listFolded | false | indicate whether list should be folded at first |
| listMaxHeight | - | list max height |
| storageName | 'aplayer-setting' | local storage key, store player settings |
| **download** | **true** | **show download button, use Blob download** |

## API

- `ap.play()`: play audio
- `ap.pause()`: pause audio
- `ap.seek(time)`: seek to specified time, time is a number in seconds
- `ap.toggle()`: toggle between play and pause
- `ap.volume(value)`: set volume, value is a number between 0 and 1
- `ap.theme(color, index)`: set theme color, index is the audio index
- `ap.setMode(mode)`: set player mode, values: 'mini', 'normal'
- `ap.notice(text, time, opacity)`: show notice, time in ms, opacity between 0 and 1
- `ap.skipBack()`: skip to previous audio
- `ap.skipForward()`: skip to next audio
- `ap.destroy()`: destroy player
- `ap.on(event, handler)`: bind event handler
- `ap.addAudio(audios)`: add audio(s) to playlist
- `ap.removeAudio(index)`: remove audio from playlist

## Events

- `abort`: Fired when the loading of an audio/video is aborted
- `canplay`: Fired when the browser can play the audio/video
- `canplaythrough`: Fired when the browser can play through the audio/video without stopping for buffering
- `durationchange`: Fired when the duration of the audio/video is changed
- `emptied`: Fired when the current playlist is empty
- `ended`: Fired when the current playlist is ended
- `error`: Fired when an error occurred during the loading of an audio/video
- `loadeddata`: Fired when the browser has loaded the current frame of the audio/video
- `loadedmetadata`: Fired when the browser has loaded meta data for the audio/video
- `loadstart`: Fired when the browser starts looking for the specified audio/video
- `pause`: Fired when the audio/video has been paused
- `play`: Fired when the audio/video has been started or is no longer paused
- `playing`: Fired when the audio/video is playing after having been paused or stopped for buffering
- `progress`: Fired when the browser is downloading the audio/video
- `ratechange`: Fired when the playing speed of the audio/video is changed
- `seeked`: Fired when the user is finished moving/skipping to a new position in the audio/video
- `seeking`: Fired when the user starts moving/skipping to a new position in the audio/video
- `stalled`: Fired when the browser is trying to get media data, but data is not available
- `suspend`: Fired when the browser is intentionally not getting media data
- `timeupdate`: Fired when the current playback position has changed
- `volumechange`: Fired when the volume has been changed
- `waiting`: Fired when the video stops because it needs to buffer the next frame
- `destroy`: Fired when the player is destroyed
- `listshow`: Fired when the playlist is shown
- `listhide`: Fired when the playlist is hidden
- `listadd`: Fired when audio(s) is added to playlist
- `listremove`: Fired when audio is removed from playlist
- `listswitch`: Fired when audio is switched
- `listclear`: Fired when playlist is cleared
- `noticeshow`: Fired when notice is shown
- `noticehide`: Fired when notice is hidden
- `lrcshow`: Fired when lrc is shown
- `lrchide`: Fired when lrc is hidden

## Download Feature

APlayer supports downloading audio files using Blob download.

```javascript
const ap = new APlayer({
    container: document.getElementById('aplayer'),
    download: true,  // Show download button (default: true)
    audio: [{
        name: 'Song Name',
        artist: 'Artist',
        url: 'https://example.com/audio.mp3',
        cover: 'https://example.com/cover.jpg'
    }]
});
```

The download button will appear between the loop button and the menu button. Clicking it will download the current audio file using Blob API.

## Related Projects

### Plugins

- [APlayer-Typecho-Plugin](https://github.com/zgq354/APlayer-Typecho-Plugin): Typecho
- [hexo-tag-aplayer](https://github.com/grzhan/hexo-tag-aplayer): Hexo
- [Hermit-X(APlayer for WordPress)](https://github.com/liwanglin12/Hermit-X): WordPress
- [APlayerHandle](https://github.com/kn007/APlayerHandle): WordPress
- [APlayer_for_Z-BlogPHP](https://github.com/fghrsh/APlayer_for_Z-BlogPHP): Z-BlogPHP
- [react-aplayer](https://github.com/sabrinaluo/react-aplayer): React
- [Vue-APlayer](https://github.com/SevenOutman/vue-aplayer): Vue
- [vue-aplayer](https://github.com/MoeFE/vue-aplayer): Vue
- [php-aplayer](https://github.com/Daryl-L/php-aplayer): PHP
- [aplayer-hugo-module](https://github.com/Runzelee/aplayer-hugo-module): Hugo

### Tooling

- [APlayer-Controler](https://github.com/Mashiro-Sorata/APlayer-Controler): controlling tool
- [MetingJS](https://github.com/metowolf/MetingJS): work with Meting music API

## Author

**APlayer** © [DIYgod](https://github.com/DIYgod), Released under the [MIT](./LICENSE) License.

> [Blog](https://diygod.me) · GitHub [@DIYgod](https://github.com/DIYgod) · Twitter [@DIYgod](https://twitter.com/DIYgod) · Telegram Channel [@awesomeDIYgod](https://t.me/awesomeDIYgod)