使用 AudioContext 播放音频实现 js 播放声音音效文件或自动播放背景音乐，解决谷歌禁止自动播放音频。

使用此办法可以实现加载完成页面后自动播放音乐了。

教程:

将下方代码添加到需要播放音乐的文件</body>标签前，修改音乐链接地址之后保存即可。

也可以创建js文件将下方代码复制粘贴进去，之后引用该JS文件也可以达到自动播放的效果。

代码

<script type="text/javascript">
playAudio('音乐链接地址', true);

function playAudio(audio_src, loop) {
    if (typeof loop == 'undefined') {
        loop = false;
    }
    var AudioContext = window.AudioContext || window.webkitAudioContext || window.mozAudioContext || window.msAudioContext;
    try {
        var globalBgAudioContext = new AudioContext();
        var source = null;
        var audioBuffer = null;

        function stopSound() {
            if (source) {
                source.stop(0);
            }
        }

        function playSound() {
            source = globalBgAudioContext.createBufferSource();
            source.buffer = audioBuffer;
            source.loop = loop;
            source.connect(globalBgAudioContext.destination);
            source.start(0);
        }

        function initSound(arrayBuffer) {
            globalBgAudioContext.decodeAudioData(arrayBuffer, function (buffer) {
                audioBuffer = buffer;
                playSound();
            }, function (e) {
                console.log('Error decoding file', e);
            });
        }

        function loadAudioFile(url) {
            var xhr = new XMLHttpRequest();
            xhr.open('GET', url, true);
            xhr.responseType = 'arraybuffer';
            xhr.onload = function (e) {
                initSound(this.response);
            };
            xhr.send();
        }

        loadAudioFile(audio_src);
        $("#stop").click(function () {
            stopSound();
        });
    } catch (e) {
        console.log('!Your browser does not support AudioContext');
    }

    document.documentElement.addEventListener('mousedown', () => {
        if (globalBgAudioContext.state !== 'running')
            globalBgAudioContext.resume();
    });
}
</script>

代码转自：php程序员的笔记