uniapp 全局背景音乐播放+暂停（跳转页面不暂停）

本文链接：https://blog.csdn.net/weixin_42150719/article/details/117034113

博客讲述了如何在uniapp中实现全局背景音乐播放，并确保在页面跳转时不暂停。作者尝试了将音乐播放管理放入main.js和vuex中，最终通过将音频实例全局化解决了音乐暂停的问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近需要一个功能是在h5中播放小游戏的背景音乐，但是跳转界面之后音乐不暂停，就是跳转多个页面之后，音乐依然在播放，在游戏界面会有设置的静音的按钮，可以开启音乐和关闭音乐。

这相当于全局的背景音乐播放事件，所以肯定是放入到全局的vuex或者是main.js

刚开始是放入main中的，一直测试不行，跳转页面的时候总是会重新加载一下音乐，导致，跳转页面之后会听到两个音乐都在播放，而且，在设置后点击暂停音乐也是不起作用。

后来我放入了vuex中，刚开始是把创建的音频实例放入方法中，点击暂停之后总是不起作用，捣鼓了好久，突然发现，暂停的是同一个音乐实例，所所以不能放入方法中，应该拎出来，放在全局的js 中，果然是成功了。

回头又看看之前放在main中的，也是同样的问题，所以又重新修改之后。main中的方法也是可以用的，

第一种：放入main中。
我是单独建了一个music.js文件，然后引入到main中的
如下：

const bgm = uni.createInnerAudioContext();
bgm.src = 'https://vod.qiniu.ayousi.cn/lq5Af14ZKVj3MmzcFFmcX0qlF7Yx'
bgm.loop = true;

var music = {
    //mute 表示是否是静音，，默认不静音
    playBgm({mute=false}){
        if (!bgm) return;
        if(mute){
            bgm.pause()