Question

我正在尝试为一个简单的游戏创建一个声音管理器，我知道这个应用程序不是必需的，但是对于我正在学习的学习经验。我尝试过几种不同的方法但尚未取得真正的成功。以下是我目前的尝试。我相信我的主要问题是我的XML请求，因为每次尝试我的文件似乎都没有加载。

关于我出错的地方或我应该采取哪些不同的建议，我们将非常感激。

我的音频管理器（远非完整，但应加载并播放声音？）

var audioctx = new (window.AudioContext || window.webkitAudioContext)();
function AudioManager(totalsounds) {
this.ctx = audioctx;
this.sounds = {};
this.totalSounds = totalsounds;
this.loaded = 0;
this.masterGain = this.ctx.createGain(); // master gain control
this.masterGain.connect(this.ctx.destination);
this.loadSound = function(name) {
    this.sounds[name] = new Sound(name, this);
    console.log("sound Loaded?");
};
this.play = function(name) {
    if(this.sounds[name] !== undefined)
    {
        this.sounds[name].source.start(0);
        console.log("playing?");
    } else
    {
        console.log(name + " - sound not found!");
    }
};
};

由管理员创建并存储在其中的声音对象。（代码似乎永远不会加载文件）

function Sound(name, audiomanager){
this.manager = audiomanager;
this.source;
this.request = new XMLHttpRequest();
this.request.open('GET', name, true);
this.request.responseType = 'arraybuffer';
console.log(" i think code stops here");
this.request.onload = function() {
    this.manager.loaded += 1;
    console.log("loaded?");
    this.manager.ctx.decodeAudioData(this.request.response).then(function(buffer){
        this.source = manager.ctx.createBufferSource();
        this.source.buffer = buffer;
        this.source.connect(manager.masterGain);
    });
};
    this.request.send();
}

很久以后我尝试按如下方式测试它。

var audio = new AudioManager(1);
audio.loadSound("test.mp3");
if(audio.loaded == audio.totalSounds){setTimeout(game, 50);}
function game() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    setInterval(function() {
        if(buttonDown[5])
        {
            audio.play("test.mp3");
        }
    },100);

提前感谢您的帮助。

Answer 1

好的，所以我让它运转了。如果有人在寻找类似问题的答案时发现这一点，那么这是一个有效的（虽然仍然非常粗糙和丑陋）版本。

var audioctx = new (window.AudioContext || window.webkitAudioContext)();
function AudioManager(totalsounds) {
this.ctx = audioctx;
this.sounds = {};
this.totalSounds = totalsounds;
this.loaded = 0;
this.masterGain = this.ctx.createGain(); // master gain control
this.masterGain.connect(this.ctx.destination);
this.loadSound = function(name, delaytime) {
    this.sounds[name] = new Sound(name, this, delaytime);
    console.log("sound Loaded?");
};
this.play = function(name) {
    var buffer = this.ctx.createBufferSource();
    if(this.sounds[name] !== undefined && !this.sounds[name].delayed)
    {
        buffer.buffer = this.sounds[name].source;
        buffer.connect(this.masterGain);
        buffer.start(0);
        console.log("playing?");
        this.sounds[name].delaySet();
    } else if(this.sounds[name].delayed)
    {
        console.log("audio delayed = " + this.sounds[name].delayed);
    } else
    {
        console.log(name + " - sound not found!");
    }

};
};
function Sound(name, audiomanager, delaytime){
this.manager = audiomanager;
this.source;
this.delay = delaytime;
this.delayed = false;
var self = this;
this.delaySet = function(){
    console.log("RESET");
    self.delayed = true;
    setTimeout(function(){self.delayed = false;}, self.delay);
};
this.request = new XMLHttpRequest();
this.request.open('GET', name, true);
this.request.responseType = 'arraybuffer';
console.log("stops here");
this.request.onload = function() {
    self.manager.loaded += 1;
    console.log("loaded?");

self.manager.ctx.decodeAudioData(self.request.response).then(function(buffer){
        self.source = buffer;
    });
};
this.request.send();
}

在添加延迟功能后略微修改了调用。（不是实际解决方案的一部分）

var audio = new AudioManager(1);
audio.loadSound("test.mp3", 1500);
var a = setInterval(function() {
if(audio.loaded >= audio.totalSounds){setTimeout(game, 50); clearInterval(a);}
}, 100);
function game() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    setInterval(function() {
        if(buttonDown[5])
        {
            console.log("SOUND");
            audio.play("test.mp3");
        }
    },100);

HTML5 / Javascript网络音频api - SoundManager

1 个答案: