使用Angular/Javascript在Edge中播放WAV音频文件 [英] Play WAV audio file in Edge with Angular/Javascript

问题描述

我在Angular中有以下代码可以播放上载的WAV文件:

I have following code in Angular to playback a uploaded WAV file:

<input #fileImportInput (change)="fileChangeListener($event)" />
<audio #myAudio controls controlsList="nodownload">
  <source src="" />
</audio>

audioElement: HTMLAudioElement;
@ViewChild('myAudio', { static: true }) myAudio: any;

ngOnInit() {
  this.audioElement = this.myAudio.nativeElement;
}

fileChangeListener(files: any): void {
  const inputFile = files.target.files[0];
  if (window.URL && window.URL.createObjectURL) {
    this.audioSrcURL = window.URL.createObjectURL(inputFile);
    this.audioElement.src = this.audioSrcURL;
  }
}

以上内容适用于Chrome和Firefox，但不适用于Edge 44(18).如何在Edge中播放WAV文件?

The above works in Chrome and Firefox, but does not work in Edge 44 (18). How can I playback WAV file in Edge?

推荐答案

尝试使用F12开发人员工具检查Edge浏览器中是否存在错误，以及音频源是否设置成功，是否没有错误，以及音频资源设置成功，请尝试调用 .play()方法以播放音频.

Try to use F12 developer tools to check whether there have some error in Edge browser, and whether the audio source is set successful, if there is no error and the audio resource is set success, try to call the .play() method to playback the audio.

此外，这是一个示例，该示例使用JavaScript上传音频文件的回放，您可以参考它:

Besides, here is a sample using JavaScript to upload the playback the audio file, you could refer to it:

    <input type="file" id="input" />
    <audio id="sound" controls="controls">
        <source src="" />
    </audio>

    <script type="text/javascript">
         var input = document.getElementById('input');
        input.onchange = function (e) {
            var sound = document.getElementById('sound');
            sound.src = URL.createObjectURL(this.files[0]);
            // not really needed in this exact case, but since it is really important in other cases,
            // don't forget to revoke the blobURI when you don't need it
            sound.onend = function (e) {
                URL.revokeObjectURL(this.src);
            }
        }
    </script>

这篇关于使用Angular/Javascript在Edge中播放WAV音频文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！