Skip to content

基于uniapp的音频处理模块,支持在h5、微信小程序控制与处理音频媒体的功能

License

Notifications You must be signed in to change notification settings

839900146/uniapp-audio-system

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

音频管理器

安装

npm i uniapp-audio-system -S

绑定实例

在main.ts入口文件中,将插件绑定到Vue实例身上

import audioPlugin from 'uniapp-audio-system/audio-system-plugin'

Vue.use(audioPlugin)

导入方式

  • 通过 import 导入使用
import audio from 'uniapp-audio-system'

audio.play('https://xxx.mp3')
  • 通过 vue实例 身上调用
export default {
  methods: {
    demo() {
      this.$audioSystem.play('https://xxx.mp3')
    }
  }
}

用法示例

import audio from 'uniapp-audio-system'

// 播放音频
/**
 * 1. 如果传递src
 *    1.1 如果src与当前正在播放的src一样,则从原先暂停的位置开始播放
 *    1.2 如果src与当前正在播放的src不一样,则从头开始播放
 * 2. 如果不传递src,且当前音频管理器上存在src,则从原先暂停的位置开始播放,否则默认啥也不干
 * 3. 第二个参数随便传,音频管理器会在相关的事件监听器中原样返回
 */
audio.play('https://xxx.mp3', { a: '1', b: false, c: 'xxx' })

// 暂停播放
audio.pause()

// 停止播放(仅微信支持)
audio.stop()

// 跳转到第30s
audio.seek(30)

// 监听开始播放
audio.onPlay((ev) => {})

// 监听暂停播放
audio.onPause((ev) => {})

// 监听停止播放
audio.onStop((ev) => {})

// 监听播放出错
audio.onError((ev) => {})

// 监听音频进入可以播放的状态
audio.onCanplay((ev) => {})

// 监听播放进度
audio.onTimeUpdate((ev) => {})

// 监听播放改变,参数是新旧params
audio.onChange((newParams, oldParams) => {})

// 获取歌曲信息(当前时长|总时长|播放状态等)
(async () => {
  let info = await audio.info('https://xxx.mp3')
})()

各方法类型定义

type TEventResult = {
  // 当前播放进度
  current: number,
  // 音频总时长
  duration: number || undefined,
  // 播放状态,true=正在播放,false=未在播放
  status: boolean,
  // 当前的src
  audioSrc: string,
  // 自定义数据
  params: any,
}

audio.play(audioSrc?: string, params: any): void

audio.pause(): void

audio.stop(): void

audio.seek(duration: number): void

audio.onPlay((ev: TEventResult) => void)

audio.onPause((ev: TEventResult) => void)

audio.onStop((ev: TEventResult) => void)

audio.onTimeUpdate((ev: TEventResult) => void)

audio.onError((ev: any) => void)

audio.onCanplay((ev: TEventResult) => void)

audio.onChange(cb: (newParams?: any, oldParams?: any) => void)

audio.info(audioSrc: string): Promise<TEventResult>

About

基于uniapp的音频处理模块,支持在h5、微信小程序控制与处理音频媒体的功能

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published