我正在开发 Asp.Net MVC Web 应用程序。我正在使用 SignalR 调用一个 javascript 方法，在这种方法中，我试图从一些后端事件中播放声音，但如果我不在同一个浏览器选项卡上或者我的浏览器像 youtube 视频一样被最小化，它就不会播放（您单击 youtube 视频链接，除非您将该屏幕前景带一次，否则它不会播放）。
<audio id="audioId" autoplay loop>
<source src="test.mp3" type="audio/mpeg">
</audio>
播放音频的代码audioId.play();
如果我在屏幕上，它可以正常工作，但如果屏幕被最小化或在后台，则不行。
【问题讨论】：
标签： javascript html jquery signalr
你可以在没有 html 标记的情况下做到这一点。
但请记住，需要在用户最小化屏幕之前加载音频文件。并且用户必须在最小化（作为任何自动播放功能）之前与文档进行交互（滚动、单击或任何触摸或单击事件）。
否则您将遇到以下错误： Uncaught (in promise) DOMException: play() failed 因为用户没有先与文档交互
去 google 看看关于自动播放的信息：https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
因此，如果您尝试类似的方法，它将无法正常工作：
$(element).on('your-event', function(){
var audio = new Audio('https://file-examples-com.github.io/uploads/2017/11/file_example_MP3_700KB.mp3');
audio.play();
}
但这种方式应该可以工作
var audio = new Audio('https://file-examples-com.github.io/uploads/2017/11/file_example_MP3_700KB.mp3');
$(element).on('your-event', function(){
audio.play();
}
这是一个关于 codepen 的工作示例：https://codepen.io/zecka/pen/VwjxGbE
【讨论】：