refactor: PC端音频引擎重写(Web Audio API) + TTS重新生成音频

src/common/js/sound.js

@@ -1,60 +1,79 @@
+let audioCtx = null
+const bufferCache = new Map()
+let chainId = 0
 
- var audio = null,
-     Mp3List=[],
-     num=0;
+function getAudioContext() {
+  if (!audioCtx) {
+    audioCtx = new (window.AudioContext || window.webkitAudioContext)()
+    const resume = () => {
+      if (audioCtx.state === 'suspended') audioCtx.resume()
+    }
+    document.addEventListener('click', resume, { once: true })
+    document.addEventListener('touchstart', resume, { once: true })
+  }
+  if (audioCtx.state === 'suspended') audioCtx.resume()
+  return audioCtx
+}
 
+function getSoundBase() {
+  try {
+    const config = JSON.parse(localStorage.getItem('WebConfig') || '{}')
+    return config.sound && config.sound == 2 ? '/static/sound2/' : '/static/sound/'
+  } catch (e) {
+    return '/static/sound/'
+  }
+}
 
- function audioMp3(mp3List,audios){
-     var WebConfig=JSON.parse(localStorage.getItem("WebConfig"));
-  audio=audios;
-  Mp3List=mp3List;
-  var mp3=new Object();
-         mp3.mp3List=mp3List;
-          mp3.url="/static/sound/";
-        if(WebConfig.sound&&WebConfig.sound==2){mp3.url="/static/sound2/";}
+async function loadBuffer(key) {
+  if (bufferCache.has(key)) return bufferCache.get(key)
+  try {
+    const ctx = getAudioContext()
+    const url = getSoundBase() + key
+    const response = await fetch(url)
+    if (!response.ok) return null
+    const arrayBuffer = await response.arrayBuffer()
+    const audioBuffer = await ctx.decodeAudioData(arrayBuffer)
+    bufferCache.set(key, audioBuffer)
+    return audioBuffer
+  } catch (e) {
+    return null
+  }
+}
 
-          mp3.auto_play=false;
-          mp3.loop=false;
-      mp3.Play=function(){
+function playBuffer(buffer) {
+  return new Promise((resolve) => {
+    const ctx = getAudioContext()
+    const source = ctx.createBufferSource()
+    source.buffer = buffer
+    source.connect(ctx.destination)
+    source.onended = resolve
+    source.start(0)
+  })
+}
 
-          audio.src=this.url+this.mp3List[0];
-          audio.load();
-          audio.play();
-      }
-      mp3.Muted=function(){
-          audio.muted ? audio.muted = false : audio.muted = true; 
-      }
-      mp3.volumeAdd=function(){
-          if(audio.volume.toFixed(1)>=1){
-              audio.volume=1
-          }else{
-              audio.volume = audio.volume + 0.1;
-          }
-      }
-      mp3.volumeMinus=function(){
-           if(audio.volume.toFixed(1)<=0){
-              audio.volume=0
-           }else{
-              audio.volume = audio.volume - 0.1; 
-           }
-      }
-      audio.addEventListener("ended", nextAudio);
-      return mp3;
- }
-   function  nextAudio(){
-       var WebConfig=JSON.parse(localStorage.getItem("WebConfig"));
-      num+=1
-      if(num<Mp3List.length){
-          audio.src="/static/sound/"+Mp3List[num];
-          if(WebConfig.sound&&WebConfig.sound==2){audio.src="/static/sound2/"+Mp3List[num];}
-          audio.play();
-      }else{
-          audio.pause();
-          audio.currentTime = 0.0; 
-          // console.log("播完")
-          num=0;
-      } 
-    }
+function audioMp3(mp3List, _audioEl) {
+  const myId = ++chainId
+  const list = mp3List || []
 
-export {audioMp3};
+  return {
+    Play() {
+      ;(async () => {
+        for (let i = 0; i < list.length; i++) {
+          if (chainId !== myId) return
+          const buffer = await loadBuffer(list[i])
+          if (!buffer) continue
+          if (chainId !== myId) return
+          await playBuffer(buffer)
+        }
+      })()
+    },
+    Pause() {
+      chainId++
+    },
+    Muted() {},
+    volumeAdd() {},
+    volumeMinus() {}
+  }
+}
 
+export { audioMp3 }