Javascript：本地文件中的音频在没有HTML的情况下无法播放&书信电报；音频>&引用；元素存在

现在这一次真的让我很困惑，所以我希望看看是否有人能发现我做错了什么

基本上，我有一个包含两个元素的页面。一个是HTML5文件处理程序，第二个是按钮。当用户选择一个文件时，我会响应生成的onchange事件，解码音频并构造一个要使用的缓冲区。我知道有HTML5音频标签，但这将是一个实用程序，需要能够将文件分解为可管理的块

我做了几次测试，发现我自己解码的音频只有在播放完页面上的音频元素后才会播放。我完全不知道是什么导致了这种行为，因为我在网上研究了几个播放音频的例子。我将包括我的音频引擎下面

只是澄清一下，所有的事情都是由这段代码处理的

多谢各位

"use strict";

var AudioFile = function (){
  this.length = 0; // Number of samples
  this.duration = 0; // Time in seconds
  this.sampleRate = 0; // Sample rate
  this.channels = 0; // Number of channels
  this.data = []; //Audio/Waveform data
};

var audioCtx = null;

class AudioEngine {
  constructor (){
    // All of the necessary audio control variables
    if(!audioCtx){
      window.AudioContext = window.AudioContext || window.webkitAudioContext;
      audioCtx = new AudioContext();
    }

    // Will hold audio data waiting to be played
    this.buffer = null;

    // This will hold the decoded audio file upon completion
    this.decodedFile = new AudioFile();

    // Automatically create buffer upon finished decoding?
    this.autoCreateBuffer = true;

    // Specify this if you want to have a function recieve
    // the decoded audio, i.e. completionCallback(decodedFile);
    this.completionCallback = null;
  }

  // This will decode an audio file
  fileCallback (event){
    console.log("file callback");
    this.buffer = null;

    var reader = new FileReader();
    var file = event.target.files[0];
    reader.onload = this.loadCallback.bind(this);

    reader.readAsArrayBuffer(file);
  }

  // Called by fileCallback after file has been loaded
  loadCallback (file){
    console.log("load callback");
    var raw = file.target.result;
    audioCtx.decodeAudioData(raw, this.decodeCallback.bind(this));
  }

  // Called by loadCallback after file has been decoded
  decodeCallback (data){
    console.log("decode callback");
    var audioTemp = new AudioFile();

    audioTemp.length = data.length;
    audioTemp.duration = data.duration;
    audioTemp.sampleRate = data.sampleRate;
    audioTemp.channels = data.numberOfChannels;

    var arr = [];
    for(var i = 0; i < data.numberOfChannels; i++){
      arr.push(new Float32Array(data.length));
      data.copyFromChannel(arr[i], i);
    }

    audioTemp.data = arr.slice(0);
    this.decodedFile = audioTemp;

    if(this.autoCreateBuffer){
      var buffer = audioCtx.createBuffer(audioTemp.channels, audioTemp.length, audioTemp.sampleRate);

      var samples;
      for(var c = 0; c < audioTemp.channels; c++){
        samples = buffer.getChannelData(c);
        for(var i = 0; i < audioTemp.length; i++){
          samples[i] = this.decodedFile.data[c][i];
        }
      }

      this.buffer = buffer;
    }

    if(this.completionCallback){
      this.completionCallback(audioTemp);
    }
  }

  // Play data that is in buffer
  play(){
    if(this.buffer){
      var source = audioCtx.createBufferSource();
      var tmp = this.buffer.getChannelData(0);

      source.buffer = this.buffer;
      source.connect(audioCtx.destination);
      source.start(0);
      console.log("play");
    }
  }
}

“严格使用”；
var AudioFile=函数（）{
this.length=0；//样本数
this.duration=0；//以秒为单位的时间
this.sampleRate=0；//采样率
this.channels=0；//通道数
this.data=[]；//音频/波形数据
};
var audioCtx=null；
类音频引擎{
构造函数（）{
//所有必要的音频控制变量
如果（！audioCtx）{
window.AudioContext=window.AudioContext | | window.webkitadiocontext；
audioCtx=新的AudioContext（）；
}
//将保存等待播放的音频数据
this.buffer=null；
//这将在完成后保存解码的音频文件
this.decodedFile=新音频文件（）；
//解码完成后自动创建缓冲区？
this.autoCreateBuffer=true；
//如果要接收函数，请指定此选项
//解码音频，即completionCallback（解码文件）；
this.completionCallback=null；
}
//这将解码音频文件
文件回调（事件）{
log（“文件回调”）；
this.buffer=null；
var reader=new FileReader（）；
var file=event.target.files[0]；
reader.onload=this.loadCallback.bind（this）；
reader.readAsArrayBuffer（文件）；
}
//加载文件后由fileCallback调用
加载回调（文件）{
log（“加载回调”）；
var raw=file.target.result；
decodeAudioData（原始，this.decodeCallback.bind（this））；
}
//文件解码后由loadCallback调用
解码回调（数据）{
log（“解码回调”）；
var audioTemp=新音频文件（）；
audioTemp.length=data.length；
audioTemp.duration=data.duration；
audioTemp.sampleRate=data.sampleRate；
audioTemp.channels=data.numberOfChannels；
var-arr=[]；
对于（变量i=0；i

好的，我已经找出了问题所在。这段代码目前正处于测试阶段，似乎与firefox上打开的控制台有关，它会干扰播放的声音。虽然，这与它的行为并不完全一致，但至少我知道我所遇到的问题的一般原因

---

换句话说，“audio”元素在控制台是否打开时没有问题，但是在使用JavaScript控制的音频打开/最小化控制台时，似乎存在未定义的行为。但是，当控制台关闭时，它的行为总是与预期的一样。

好的，我已经找出了问题所在。这段代码目前正处于测试阶段，似乎与firefox上打开的控制台有关，它会干扰播放的声音。虽然，这与它的行为并不完全一致，但至少我知道我所遇到的问题的一般原因

---

换句话说，“audio”元素在控制台是否打开时没有问题，但是在使用JavaScript控制的音频打开/最小化控制台时，似乎存在未定义的行为。但是，当控制台关闭时，它的行为总是与预期的一样。

现在我真的很困惑。我决定对我的代码进行一次快速测试，测试结果与预期相符。也许这是我使用的浏览器（firefox）的一个bug，这绝对值得研究。我不知道如何复制它…现在我真的很困惑。我决定对我的代码进行一次快速测试，测试结果与预期相符。也许这是我使用的浏览器（firefox）的一个bug，这绝对值得研究。但是我不知道如何复制它。。。