默认不能自动播放音频？有办法！！！

谷歌浏览器（）以及其他现代浏览器对音频和视频的自动播放实施了严格的限制，这是为了提升用户体验、节省带宽并减少不必要的打扰。根据这些政策，浏览器通常不允许网页在没有用户交互的情况下播放带有声音的媒体内容。这种限制是基于以下原因：

一、用户体验

1、避免突然的声音干扰：未经用户许可播放音频可能会打扰到用户，尤其是在公共场合或会议中。

2、节省资源：阻止自动播放可以防止后台标签页或其他不被用户关注的内容消耗过多的网络带宽和设备资源。

自2017年以来，逐步收紧了其自动播放策略。最初，它允许静音的视频自动播放，但要求任何有声内容必须由用户交互触发。随着时间推移，政策变得更加严格，确保只有在用户明确表示同意后才能播放音频。

二、发现问题

当用户首次与页面进行交互（例如点击屏幕、按键等），浏览器会认为这是一个合法的用户操作，允许随后的音频播放请求。因此，在用户点击屏幕之后，音频才会播放。

三、实现方式

1、使用静音播放

如果你能够接受音频最初是静音的，许多浏览器允许自动播放静音的音频。然后，你可以根据需要取消静音。

const audio = new Audio('path/to/your/.mp3');
 = true;
().then(() {
    // 取消静音并调整音量
     = false;
    audio. = ; // 设置适当的音量值
}).catch((error) {
    .error("Error  muted audio: ", error);
});

2、等待用户交互

确保所有音频播放都是由用户的明确动作触发的，比如点击按钮或其他交互事件。

<! html>
<html lang="en">
<head>
    <meta ="UTF-8">
    <title>Play Sound</title>
</head>
<body>
    < id="">Play Sound</>
    <audio id="audio" src=".mp3"></audio>

    <>
        .('').('click', () {
            const audio = .('audio');
            ().then(() => {
                .log('Audio is ');
            }).catch(error => {
                .error('Error  audio:', error);
            });
        });
    </>
</body>
</html>

3、利用通知或弹窗

<! html>
<html lang="en">
<head>
    <meta ="UTF-8">
    <title>Play Sound</title>
</head>
<body>
    <audio id="audio" src=".mp3"></audio>

    <>
         () {
            const audio = .('audio');
            ().then(() => {
                .log('Audio is ');
            }).catch(error => {
                .error('Error  audio:', error);
            });
        }

        if (. === '') {
            ();
        } else if (. !== '') {
            .().then( => {
                if ( === '') {
                    ();
                }
            });
        }
    </>
</body>
</html>