技术实现摘录

音频全局单例 + 请求竞态控制

js
// audio.js - 全局唯一 Audio 实例
let audioInstance = null
export const getAudio = () => audioInstance || (audioInstance = new Audio())

// music.js - playRequestId 递增丢弃过期请求
let playRequestId = 0
async function playFromQueue(index) {
  const rid = ++playRequestId
  stopAudio()
  loading.value = true
  const data = await fetchAPI({ type: 'json', ids: song.id })
  if (rid !== playRequestId) return  // 后面的请求已覆盖，丢弃本次
  audio.src = data.url
  audio.play()
}