From 409e976209a33ebc2b8894248211c75aefd3a526 Mon Sep 17 00:00:00 2001
From: sion123 <450702724@qq.com>
Date: Mon, 2 Feb 2026 23:16:38 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8A=9F=E8=83=BD=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../web-gold/src/components/VoiceSelector.vue | 117 ++++++++++--------
 .../web-gold/src/views/kling/IdentifyFace.vue |  14 +--
 .../tik/voice/client/SiliconFlowProvider.java |   2 +-
 .../config/SiliconFlowProviderConfig.java     |   4 +-
 .../service/TikUserVoiceServiceImpl.java      |   1 +
 5 files changed, 76 insertions(+), 62 deletions(-)

diff --git a/frontend/app/web-gold/src/components/VoiceSelector.vue b/frontend/app/web-gold/src/components/VoiceSelector.vue
index 02cec98c4b..f872258a8a 100644
--- a/frontend/app/web-gold/src/components/VoiceSelector.vue
+++ b/frontend/app/web-gold/src/components/VoiceSelector.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="voice-selector">
-    <div v-if="displayedVoices.length === 0" class="empty-voices">
+    <div v-if="userVoiceCards.length === 0" class="empty-voices">
       还没有配音，可先在"配音管理"中上传
     </div>
 
@@ -19,31 +19,52 @@
         size="small"
         :disabled="!selectedVoiceId"
         :loading="previewLoadingVoiceId === selectedVoiceId"
-        @click="handlePreviewCurrentVoice"
+        @click="handleSynthesize"
       >
         <template #icon>
           <SoundOutlined />
         </template>
-        试听
+        合成
       </a-button>
     </div>
 
     <!-- APlayer 播放器容器 -->
     <div v-if="audioUrl" ref="playerContainer" class="aplayer-container"></div>
+
+    <!-- 下载按钮 -->
+    <a-button
+      v-if="audioUrl"
+      type="link"
+      size="small"
+      @click="downloadAudio"
+      class="download-link"
+    >
+      下载音频
+    </a-button>
   </div>
 </template>
 
 <script setup>
-import { ref, computed, onMounted, onBeforeUnmount, nextTick } from 'vue'
+import { ref, computed, onMounted, onBeforeUnmount, nextTick, watch } from 'vue'
 import { useVoiceCopyStore } from '@/stores/voiceCopy'
 import { useTTS, TTS_PROVIDERS } from '@/composables/useTTS'
 import APlayer from 'aplayer'
 
+const props = defineProps({
+  synthText: {
+    type: String,
+    default: ''
+  },
+  speechRate: {
+    type: Number,
+    default: 1.0
+  }
+})
+
 const voiceStore = useVoiceCopyStore()
 
 const emit = defineEmits(['select'])
 
-// APlayer 实例
 let player = null
 const playerContainer = ref(null)
 const audioUrl = ref('')
@@ -87,27 +108,21 @@ const defaultCover = `data:image/svg+xml;base64,${btoa(`
 // 使用TTS Hook
 const {
   previewLoadingVoiceId,
-  playingPreviewVoiceId,
-  ttsText,
-  speechRate,
   playVoiceSample,
   setText,
-  setSpeechRate,
-  resetPreviewState
+  setSpeechRate
 } = useTTS({
   provider: TTS_PROVIDERS.SILICONFLOW
 })
 
-// 当前选中的音色ID
 const selectedVoiceId = ref('')
 
-// 从store数据构建音色列表
 const userVoiceCards = computed(() =>
   (voiceStore.profiles || []).map(profile => ({
     id: `user-${profile.id}`,
     rawId: profile.id,
     name: profile.name || '未命名',
-    category:'',
+    category: '',
     gender: profile.gender || 'female',
     description: profile.note || '我的配音',
     fileUrl: profile.fileUrl,
@@ -117,18 +132,14 @@ const userVoiceCards = computed(() =>
   }))
 )
 
-const displayedVoices = computed(() => userVoiceCards.value)
-
-// 转换为下拉框选项格式
 const voiceOptions = computed(() =>
-  displayedVoices.value.map(voice => ({
+  userVoiceCards.value.map(voice => ({
     value: voice.id,
     label: voice.name,
-    data: voice // 保存完整数据
+    data: voice
   }))
 )
 
-// 音色选择变化处理
 const handleVoiceChange = (value, option) => {
   const voice = option.data
   selectedVoiceId.value = value
@@ -136,26 +147,33 @@ const handleVoiceChange = (value, option) => {
   emit('select', voice)
 }
 
-// 试听当前选中的音色
-const handlePreviewCurrentVoice = () => {
+const handleSynthesize = () => {
   if (!selectedVoiceId.value) return
 
-  const voice = displayedVoices.value.find(v => v.id === selectedVoiceId.value)
+  const voice = userVoiceCards.value.find(v => v.id === selectedVoiceId.value)
   if (!voice) return
 
   currentVoiceName.value = voice.name
   handlePlayVoiceSample(voice)
 }
 
+// 监听 prop 变化，更新 TTS 参数
+watch(() => props.synthText, (newText) => {
+  setText(newText || '')
+}, { immediate: true })
+
+watch(() => props.speechRate, (newRate) => {
+  setSpeechRate(newRate)
+}, { immediate: true })
+
 /**
- * 处理音色试听
+ * 处理音色
  */
 const handlePlayVoiceSample = (voice) => {
   currentVoiceName.value = voice.name
   playVoiceSample(
     voice,
     (data) => {
-      // 提取音频 URL
       const url = data.audioUrl || data.objectUrl
       if (!url) {
         console.error('无效的音频数据格式', data)
@@ -186,14 +204,11 @@ const initPlayer = (url) => {
       preload: 'auto',
       volume: 0.7,
       audio: [{
-        name: currentVoiceName.value || '语音试听',
-        artist: '试听',
+        name: currentVoiceName.value || '语音合成',
+        artist: '合成',
         url: url,
         cover: defaultCover
-      }],
-      options: {
-        showDownload: true
-      }
+      }]
     })
 
     player.on('ended', () => {
@@ -209,6 +224,20 @@ const initPlayer = (url) => {
   })
 }
 
+/**
+ * 下载音频
+ */
+const downloadAudio = () => {
+  if (!audioUrl.value) return
+
+  const link = document.createElement('a')
+  link.href = audioUrl.value
+  link.download = `${currentVoiceName.value || '语音合成'}.mp3`
+  document.body.appendChild(link)
+  link.click()
+  document.body.removeChild(link)
+}
+
 /**
  * 销毁播放器
  */
@@ -227,26 +256,7 @@ const destroyPlayer = () => {
   }
 }
 
-/**
- * 设置要试听的文本（供父组件调用）
- * @param {string} text 要试听的文本
- */
-const setPreviewText = (text) => {
-  setText(text)
-}
-
-/**
- * 设置语速（供父组件调用）
- * @param {number} rate 语速倍率
- */
-const setPreviewSpeechRate = (rate) => {
-  setSpeechRate(rate)
-}
-
-defineExpose({
-  setPreviewText,
-  setPreviewSpeechRate
-})
+defineExpose({})
 
 onMounted(async () => {
   await voiceStore.refresh()
@@ -294,4 +304,11 @@ onBeforeUnmount(() => {
 .aplayer-container {
   margin-top: 12px;
 }
+
+/* 下载链接样式 */
+.download-link {
+  margin-top: 8px;
+  padding: 0;
+  font-size: 12px;
+}
 </style>
diff --git a/frontend/app/web-gold/src/views/kling/IdentifyFace.vue b/frontend/app/web-gold/src/views/kling/IdentifyFace.vue
index 840d8807b2..d92eb02b1e 100644
--- a/frontend/app/web-gold/src/views/kling/IdentifyFace.vue
+++ b/frontend/app/web-gold/src/views/kling/IdentifyFace.vue
@@ -24,7 +24,11 @@
           <!-- 音色选择 -->
           <div class="section">
             <h3>音色</h3>
-            <VoiceSelector ref="voiceSelectorRef" @select="handleVoiceSelect" />
+            <VoiceSelector
+              :synth-text="ttsText"
+              :speech-rate="speechRate"
+              @select="handleVoiceSelect"
+            />
           </div>
 
           <!-- TTS 控制 -->
@@ -300,8 +304,6 @@ import FullWidthLayout from '@/layouts/components/FullWidthLayout.vue'
 import { useIdentifyFaceController } from './hooks/useIdentifyFaceController'
 
 const voiceStore = useVoiceCopyStore()
-const voiceSelectorRef: any = ref(null)
-
 const dragOver = ref(false)
 
 // ==================== 初始化 Controller ====================
@@ -355,12 +357,6 @@ const {
 
 onMounted(async () => {
   await voiceStore.refresh()
-
-  // 设置VoiceSelector的试听文本和语速
-  if (voiceSelectorRef.value) {
-    voiceSelectorRef.value.setPreviewText(ttsText.value)
-    voiceSelectorRef.value.setPreviewSpeechRate(speechRate.value)
-  }
 })
 </script>
 
diff --git a/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/client/SiliconFlowProvider.java b/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/client/SiliconFlowProvider.java
index e1ae8a32bf..8070b67f11 100644
--- a/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/client/SiliconFlowProvider.java
+++ b/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/client/SiliconFlowProvider.java
@@ -66,7 +66,7 @@ public class SiliconFlowProvider implements VoiceCloneProvider {
                     .header("Authorization", "Bearer " + config.getApiKey())
                     .header("Content-Type", MediaType.APPLICATION_JSON_VALUE)
                     .body(requestBody)
-                    .timeout((int) config.getConnectTimeout().toMillis())
+                    .timeout((int) config.getReadTimeout().toMillis())
                     .execute();
 
             String responseBody = response.body();
diff --git a/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/config/SiliconFlowProviderConfig.java b/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/config/SiliconFlowProviderConfig.java
index 370965ad14..2c4fc0710a 100644
--- a/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/config/SiliconFlowProviderConfig.java
+++ b/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/config/SiliconFlowProviderConfig.java
@@ -64,9 +64,9 @@ public class SiliconFlowProviderConfig extends VoiceProviderProperties.ProviderC
     private Duration connectTimeout = Duration.ofSeconds(10);
 
     /**
-     * 读取超时时间（3分钟，提升语音合成成功率）
+     * 读取超时时间（5分钟，提升语音合成成功率）
      */
-    private Duration readTimeout = Duration.ofSeconds(180);
+    private Duration readTimeout = Duration.ofSeconds(300);
 
     /**
      * 检查是否可用（有 API Key 即可用）
diff --git a/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/service/TikUserVoiceServiceImpl.java b/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/service/TikUserVoiceServiceImpl.java
index a548745307..5dc3fb6557 100644
--- a/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/service/TikUserVoiceServiceImpl.java
+++ b/yudao-module-tik/src/main/java/cn/iocoder/yudao/module/tik/voice/service/TikUserVoiceServiceImpl.java
@@ -1,6 +1,7 @@
 package cn.iocoder.yudao.module.tik.voice.service;
 
 import cn.hutool.core.collection.CollUtil;
+import cn.hutool.core.util.ObjectUtil;
 import cn.hutool.core.util.StrUtil;
 import cn.hutool.http.HttpUtil;
 import cn.hutool.json.JSONArray;