初次提交

2026-09-06 08:19:02 +08:00
commit 4ce4649aaf
1061 changed files with 337258 additions and 0 deletions
@@ -0,0 +1,73 @@
+<template>
+  <audio
+    v-if="song?.musicUrl"
+    ref="audioPlayer"
+    :src="song.musicUrl"
+    crossorigin="anonymous"
+    autoplay
+    preload="auto"
+    referrerpolicy="no-referrer"
+    @canplay="$emit('canplay', $event)"
+    @ended="$emit('ended', $event)"
+    @error="$emit('error', $event)"
+    @loadedmetadata="$emit('loadedmetadata', $event)"
+    @loadstart="$emit('loadstart', $event)"
+    @pause="$emit('pause', $event)"
+    @play="$emit('play', $event)"
+    @timeupdate="$emit('timeupdate', $event)"
+  />
+  <!-- 如果没有 musicUrl（如哔哩哔哩视频），创建一个虚拟的 audio 元素 -->
+  <audio v-else-if="song" ref="audioPlayer" style="display: none" />
+</template>
+
+<script setup>
+import { ref, watch, nextTick } from 'vue'
+
+const props = defineProps({
+  song: {
+    type: Object,
+    default: null
+  }
+})
+
+const emit = defineEmits([
+  'timeupdate',
+  'ended',
+  'loadedmetadata',
+  'error',
+  'play',
+  'pause',
+  'loadstart',
+  'canplay'
+])
+
+const audioPlayer = ref(null)
+
+// 错误消息常量，避免使用魔法字符串
+const ERROR_MESSAGES = {
+  BILIBILI_NO_AUDIO: 'No audio URL available for Bilibili video'
+}
+
+// 监听 song 变化，如果没有 musicUrl 则立即触发错误
+watch(
+  () => props.song,
+  (newSong, oldSong) => {
+    if (newSong && !newSong.musicUrl) {
+      // 使用 nextTick 确保 DOM 已更新
+      nextTick(() => {
+        // 创建一个自定义错误对象
+        const error = new Error(ERROR_MESSAGES.BILIBILI_NO_AUDIO)
+        error.name = 'BilibiliNoAudioError'
+
+        // 立即触发错误事件
+        emit('error', error)
+      })
+    }
+  },
+  { immediate: true }
+)
+
+defineExpose({
+  audioPlayer
+})
+</script>