vue.js未捕获（承诺）DOMException：无法解码音频数据

Question

我在vue中使用以下代码遇到此错误。

1. Chrome浏览器，歌剧： formulario：1未捕获（承诺）DOMException：无法解码音频数据

2. firefox： EncodingError：不支持给定的编码。

我不明白为什么使用http url可以正常工作，但是一旦我使用本地路径，它就会返回该错误。在两种情况下都是相同的音频文件。

 errorFile: "https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/error.mp3",
 successFile: "./error.mp3"

最初是在/app/src/assets/snd/error.mp3中 和我的组件在/app/src/components/form.vue

所以我从../ assets / snd / error.mp3

开始

为了完全简化路径，我将文件带到了components目录本身，但是没有办法...

我找不到解决方案...

我也尝试过：

successFile: new Audio(require('./error.mp3'))

，但结果相同。 （！◡‿◡）

如您所见，ima完全是菜鸟... 所以请您花点时间。

V。

   <template>
          <div>
          <button @click="playFile(successFile)">Success</button>
          <br />
          <br />
          <button @click="playFile(errorFile)">Error</button>
          </div>
    </template>
    
    
    <script>
    export default {
      name: "FormularioComp",
      methods: {
        playFile(path) {
          fetch(path)
            .then(response => response.arrayBuffer())
            .then(arrayBuffer => this.context.decodeAudioData(arrayBuffer))
            .then(audioBuffer => {
              const fuente = this.context.createBufferSource();
              fuente.buffer = audioBuffer;
              fuente.connect(this.context.destination);
              fuente.start();
            });
        }
      },
      data() {
        return {
          context: new window.AudioContext(),
          errorFile: "https://s3-us-west-2.amazonaws.com/s.cdpn.io/3/error.mp3",
          successFile: "./error.mp3"
        };
      }
    };
    </script>