javascript 对象方法中的局部变量音频未播放
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/53058421/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Local variable audio in object method not playing
提问by Hyman Bashford
I'm making a game, and I want sounds to play on events occurring. I have currently got an object that looks like below:
我正在制作一个游戏，我想要在发生的事件上播放声音。我目前有一个如下所示的对象：
var soundObject = {
invaderShoot: function() {
var audio = new Audio("laser.wav");
audio.play();
},
//Many more of the same method
};
And then I'm playing the sounds like this:
然后我播放这样的声音：
soundObject.invaderShoot();
However, when I try to do this, it comes up with the following error:
但是，当我尝试这样做时，会出现以下错误：
Unhandled Promise Rejection: NotAllowedError: The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.
And it comes up highlighting this line in the method:
它出现在方法中突出显示这一行：
audio.play();
What is the problem? I have searched through GitHub threads and Stack Overflow questions, but I cannot find a definitionof what the error is, let alone how to fix it.
问题是什么？我已经搜索了 GitHub 线程和 Stack Overflow 问题，但找不到错误的定义，更不用说如何修复它了。
How should I fix this?
我应该如何解决这个问题？
I am only permitted to use .wavfiles, because that is the only file format that my code hosting service allows.
我只被允许使用.wav文件，因为这是我的代码托管服务允许的唯一文件格式。
回答by Narendra
Audio.play() returns a Promise which is resolved when playback has been successfully started. Failure to begin playback for any reason, such as permission issues, result in the promise being rejected.
Audio.play() 返回一个 Promise，它在播放成功开始时被解析。由于任何原因（例如权限问题）未能开始播放，都会导致承诺被拒绝。
const playedPromise = audio.play();
if (playedPromise) {
playedPromise.catch((e) => {
if (e.name === 'NotAllowedError' ||
e.name === 'NotSupportedError') {
//console.log(e.name);
}
});
}
In your case, looks like your browser/os does not allow automatic playing of audio. The user agent (browser) or operating system doesn't allow playback of media in the current context or situation. This may happen, for example, if the browser requires the user to explicitly start media playback by clicking a "play" button. Hereis the reference.
在您的情况下，您的浏览器/操作系统似乎不允许自动播放音频。用户代理（浏览器）或操作系统不允许在当前上下文或情况下播放媒体。例如，如果浏览器要求用户通过单击“播放”按钮显式开始媒体播放，则可能会发生这种情况。这是参考。
As far as AutoPlay is concerned, you might need to add AudoContext in your HTML as per new browser policy. https://developers.google.com/web/updates/2017/09/autoplay-policy-changes#webaudio
就自动播放而言，您可能需要根据新的浏览器策略在 HTML 中添加 AudoContext。 https://developers.google.com/web/updates/2017/09/autoplay-policy-changes#webaudio
EDIT
编辑
window.onload = function() {
var context = new AudioContext();
// Setup all nodes
...
}
context.resume().then(() => {
audio.play();
console.log('Playback resumed successfully');
});
回答by Ish
From the attached bug, it seems that the issue is due to audio/ video auto play being disabled by default. This of course has practical for the user as it reduces the amount of abuse though adds. For your situation however it means that you can't create the audio object on the fly.
从附加的错误来看，问题似乎是由于默认情况下禁用了音频/视频自动播放。这对用户来说当然是实用的，因为它减少了滥用的数量，但增加了。但是，对于您的情况，这意味着您无法即时创建音频对象。
Instead you should create it beforehand and simply switch the URL/ resume the audio when you need it. The following snippet from the attached ticket seems promising.
相反，您应该事先创建它，并在需要时简单地切换 URL/恢复音频。来自附加票证的以下片段似乎很有希望。
// sm2 attaches the audio element as sound._a
let audio = sound._a;
audio.crossOrigin = 'anonymous';
sound._sourceNode = audioContext.createMediaElementSource(audio);
sound._sourceNode.connect(inputNode);
function play() {
/**
* If an AudioContext is created prior to the document receiving a
* user gesture, it will be created in the "suspended" state, and
* you will need to call resume() after a user gesture is
* received.
*/
audioContext.resume().then(() => {
sound.play();
});
}
