diff --git a/Cunkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/AudioMessage/AudioMessage.tsx b/Cunkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/AudioMessage/AudioMessage.tsx index 0d2ba39b..f087165c 100644 --- a/Cunkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/AudioMessage/AudioMessage.tsx +++ b/Cunkebao/src/pages/pc/ckbox/weChat/components/ChatWindow/components/MessageRecord/components/AudioMessage/AudioMessage.tsx @@ -35,13 +35,20 @@ const parseAudioUrl = (audioUrl: string): AudioData => { }; }; -// 测试音频URL是否可访问 +// 测试音频URL是否可访问(避免CORS问题) const testAudioUrl = async (url: string): Promise => { try { + // 对于阿里云OSS等外部资源,直接返回true,让Audio对象自己处理 + // 避免fetch HEAD请求触发CORS问题 + if (url.includes(".aliyuncs.com") || url.includes("oss-")) { + return true; + } + const response = await fetch(url, { method: "HEAD" }); return response.ok; } catch (error) { - return false; + // 如果fetch失败(可能是CORS问题),返回true让Audio对象尝试加载 + return true; } }; @@ -88,8 +95,14 @@ const AudioMessage: React.FC = ({ audioUrl, msgId }) => { const newAudio = new Audio(); - // 设置跨域属性 - newAudio.crossOrigin = "anonymous"; + // 对于阿里云OSS等外部资源,不设置crossOrigin避免CORS问题 + // 只有在需要访问音频数据时才设置crossOrigin + if ( + !actualAudioUrl.includes(".aliyuncs.com") && + !actualAudioUrl.includes("oss-") + ) { + newAudio.crossOrigin = "anonymous"; + } newAudio.preload = "metadata"; audioRefs.current[audioId] = newAudio; @@ -120,37 +133,9 @@ const AudioMessage: React.FC = ({ audioUrl, msgId }) => { await newAudio.play(); setPlayingAudioId(audioId); } catch (error) { - // 尝试备用方案:不设置crossOrigin - try { - const fallbackAudio = new Audio(actualAudioUrl); - audioRefs.current[audioId] = fallbackAudio; - - // 重新绑定事件监听器 - fallbackAudio.addEventListener("timeupdate", () => { - const currentProgress = - (fallbackAudio.currentTime / fallbackAudio.duration) * 100; - setAudioProgress(prev => ({ - ...prev, - [audioId]: currentProgress, - })); - }); - - fallbackAudio.addEventListener("ended", () => { - setPlayingAudioId(null); - setAudioProgress(prev => ({ ...prev, [audioId]: 0 })); - }); - - fallbackAudio.addEventListener("error", e => { - setPlayingAudioId(null); - setAudioError("音频播放失败,请稍后重试"); - }); - - await fallbackAudio.play(); - setPlayingAudioId(audioId); - } catch (fallbackError) { - setPlayingAudioId(null); - setAudioError("音频播放失败,请检查音频格式或网络连接"); - } + setPlayingAudioId(null); + setAudioError("音频播放失败,请检查音频格式或网络连接"); + console.error("音频播放错误:", error); } } else { if (isPlaying) {