视频或音频自动播放，有声播放，无需用户交互

Question

我有一个订票网站。当票证准备好提供时，应打开一个模式，并且应随票证信息一起播放声音。我希望无需用户交互即可播放声音，以提供更好的用户体验。

网站有两个页面：一个是登录页面，另一个是票务服务列表。当用户一步步进入网站，先登录，再导航到票务服务页面，满足用户交互条件，音频播放有声。但是，有一个警告：当我进入票务服务页面并刷新时，用户交互内存会被重置，因此用户必须再次单击某处。我想用声音播放音频而不需要用户交互来改善网站体验。

根据 Chrome 自动播放文档，提到顶部框架可以将自动播放权限委托给其 iframe，以允许自动播放声音。

有人知道如何实现这个吗？

我尝试了 iframe 委托，但到目前为止还没有成功。

Answer 1

浏览器策略禁止自动播放以防止滥用。至少必须与页面进行最少的用户交互才能播放声音。 您可以执行以下操作：

function initUserInterac(){
    const handler = function(){
        window.localStorage.setItem('user_interacted', 'true');
        document.body.removeEventListener("click", handler, true);
    }
    document.body.addEventListener("click", handler, true);
}

function hasUserInteracted() {
    return window.localStorage.getItem('user_interacted') === 'true';
}

function main() {
    // ...
    if (hasUserInteracted()) {
        playSound();
    }
}