javascript - 从 INACTIVE 浏览器选项卡播放声音

标签 javascript google-chrome audio browser

我有一个餐厅控制面板,它会在下订单时播放提示音。问题是,当控制面板选项卡不是 Chrome 中的事件选项卡时(对于 Firefox 也是如此),警报声音不会播放。单击选项卡后,它会播放声音。

我看到一些网站(Facebook Chat、Cloudstats.me 服务器警报等)即使在非事件选项卡中也会播放声音,那么这个问题的解决方法是什么?

最佳答案

如果我也发生过类似的事情,我们正试图在当天股市开盘和收盘时播放市场时钟。我们遇到的问题是我们尝试加载 mp3,然后在满足条件时播放它。所以本来我有。

var bell;

// Update the clock, countdown, and tooltips as needed.
function updateClock() {
    service.getMarketDate(function(data) {

        if (data.soundMarketBell) {
            if (!bell) {
                bell = new Audio('/sounds/marketclock.mp3');
            }
            bell.play();
        }
    });
}

var intervalId = $interval(updateClock, 1000);

通过将资源加载移动到页面加载时发生,然后只调用 Audio.play 就解决了这个问题

var bell = new Audio('/sounds/marketclock.mp3');

// Update the clock, countdown, and tooltips as needed.
function updateClock() {
    service.getMarketDate(function(data) {
        if (data.soundMarketBell) {
            bell.play();
        }
    });
}

// check for a time update every second
// to balance accuracy with performance
var intervalId = $interval(updateClock, 1000)

当标签页处于非事件状态时,浏览器会限制加载资源

关于javascript - 从 INACTIVE 浏览器选项卡播放声音,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33196475/

相关文章:

c# - 声音播放器问题? boolean 语句应执行声音

javascript - 页面加载时如何更改表单输入的背景颜色?

javascript - Chrome 浏览器中的字体系列 "Arial black"解析问题

audio - 声音处理引用

javascript - Service Worker 的 `cache api` 限制是多少?

javascript - 放大和缩小在 chrome 中不起作用

audio - 用于从音频流中提取单词(语音)的库?

javascript - 模态按钮添加到 html 表格行,同时从 json 文件导入表格数据

javascript - 飞行前 OPTIONS 请求 CORS

javascript - 从回调函数中调用其他函数