From 637c7d0c47aefe6f183cb38a6f39c9e84b05a3f2 Mon Sep 17 00:00:00 2001 From: weipengfei <2187978347@qq.com> Date: Thu, 12 Oct 2023 19:13:32 +0800 Subject: [PATCH] gengx --- src/views/chat/components/Message/index.vue | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/src/views/chat/components/Message/index.vue b/src/views/chat/components/Message/index.vue index e22f7af..b15a7e2 100644 --- a/src/views/chat/components/Message/index.vue +++ b/src/views/chat/components/Message/index.vue @@ -92,6 +92,7 @@ async function handleCopy() { } } +let playIndex = 0; async function radioPlay() { console.log('播放', props.mp3) const socket = new WebSocket('wss://chat.lihaink.cn/zhanti/tts'); @@ -101,6 +102,7 @@ async function radioPlay() { // 监听WebSocket连接打开事件 socket.onopen = () => { console.log('socket已连接') + playIndex = 0; resolve(null) } }) @@ -114,16 +116,20 @@ async function radioPlay() { } socket.send(JSON.stringify( { -            "data": "快科技10月12日消息，不宣而发的华为Mate 60在上架官方商城后，直到现在都处于一机难求的状态。由于Mate 60系列的爆火，华为也是将明年的预计手机出货量翻倍到了7000万台。 华为Mate 60的热销对同期上市的iPhone15产生了很大的冲击。不仅对华为品牌起到提振效果，也对上游国内相关企业产生了积极的影响。 其中华为Mate 60采用了6.69英寸的OLED柔性屏幕，分辨率为FHD+ 2688×1216。Mate 60 Pro则采用了6.82英寸的四曲面屏幕，分辨率为FHD+ 2720 × 1260。这两款手机屏幕都支持1-120Hz LTPO自适应刷新率、1440Hz高频PWM调光以300 Hz触控采样率。" - -        })) +     "data": "快科技10月12日消息，不宣而发的华为Mate 60在上架官方商城后，直到现在都处于一机难求的状态。由于Mate 60系列的爆火，华为也是将明年的预计手机出货量翻倍到了7000万台。 华为Mate 60的热销对同期上市的iPhone15产生了很大的冲击。不仅对华为品牌起到提振效果，也对上游国内相关企业产生了积极的影响。 其中华为Mate 60采用了6.69英寸的OLED柔性屏幕，分辨率为FHD+ 2688×1216。Mate 60 Pro则采用了6.82英寸的四曲面屏幕，分辨率为FHD+ 2720 × 1260。这两款手机屏幕都支持1-120Hz LTPO自适应刷新率、1440Hz高频PWM调光以300 Hz触控采样率。" + })) // 监听WebSocket接收消息事件 socket.onmessage = (event: any) => { const msg = JSON.parse(event.data); console.log(msg.mp3); - - } + const a = new Audio(msg.mp3) + a.addEventListener('ended', () => { + onAudioEnd(playIndex) + }) + audioElements.push(a) + if(playIndex==0) playAudio() + } // for (let i = 0; i < props.mp3.length; i++) { // const a = new Audio(props.mp3[i]) @@ -140,7 +146,6 @@ const onAudioEnd = (index: any) => { if (index + 1 < audioElements.length) audioElements[index + 1].play() } - // 创建音频对象的数组 const audioElements = reactive([]) // 播放音频