自谷歌自动播放政策更改后如何在网站上播放通知声音

Posted 2023-02-25

【中文标题】自谷歌自动播放政策更改后如何在网站上播放通知声音

【英文标题】：How to play notification sound on website since google autoplay policy change

【发布时间】：2019-10-28 12:21:54

【问题描述】：

我一直在尝试在网站上发出短促的哔声，但谷歌自动播放政策更改不允许我这样做，我应该怎么做。我已经看到很多网站仍在这样做，例如 Facebook 聊天等。

我试过这个没有成功（也试过元素）：

function beep(vol, freq, duration)
v=a.createOscillator()
u=a.createGain()
v.connect(u)
v.frequency.value=freq
v.type="square"
u.connect(a.destination)
u.gain.value=vol*0.01
v.start(a.currentTime)
v.stop(a.currentTime+duration*0.001);

beep(vol, freq, duration);

【问题讨论】：

u 和 v 是否在函数外部使用 var 声明？

u 和 v 仅在函数内部，但在外部声明：a=new AudioContext();

您必须使用var 声明变量。 var a = new Something()

【参考方案1】：

问题是根据 Chrome 的自动播放策略，在某些情况下自动播放声音会被阻止。

在以下情况下允许自动播放声音：

用户与域

互动

（点击、点按等）。 在桌面设备上，用户的媒体参与指数阈值已被超过，这意味着用户

之前曾播放过

有声视频。 用户已将网站添加到移动设备的主屏幕或

在桌面设备上安装了 PWA

。 顶部框架可以将自动播放权限委托给它们的

iframe

，以允许自动播放声音。

更多详情请见https://developers.google.com/web/updates/2017/09/autoplay-policy-changes#webaudio。

【讨论】：

任何想法或示例如何用您的积分做到这一点？

【参考方案2】：

您可以使用以下代码，但必须在该网站的通知设置中将Sound 设置为Allow，例如 Google Chrome 设置中的 localhost:8000

 let audio = new Audio("../../assets/sound/quite-impressed.wav");
  audio.play();