微信小程序 - 详细实现页面后台静默播放背景音乐播放音频效果，页面不会显示任何音乐播放器卡片、播放信息等，适合在页面右上角悬浮一个旋转音乐盒可随时让用户暂停播放，音乐碟片旋转背后播放歌曲在前台看不到！

前言

网上都是在前台直接显示播放卡片的教程，本文支持在后台静默隐藏播放音频音乐。

在微信小程序开发中，详解实现小程序页面悬浮一个旋转音乐盒并在后台播放音频歌曲，可点击此图标或自定义元素实现暂停播放、继续播放音频、背景音乐播放与暂停控制，在后台播放时不会有任何的歌曲信息卡片展示，真正实现后台静默 “偷偷播放” 音频，常见于生日祝福页面、海报宣传页面、活动页面、礼物页面等场景，该类型的页面进入后会自动播放背景音乐并且页面会悬浮一个音乐图标按钮，它可以360度旋转，用于静音、取消静音、暂停播放、继续播放等操作，提供详细示例源码，解决苹果IOS手机静音状态下无声音、音频播放卡顿、自动开启声音、页面离开切换暂停等问题。

小程序 vue2 | vue3 版本语法都能使用，跟着教程复制代码运行即可。

---

如下图所示，适用于页面需要后台静默播放背景音乐，且有一个悬浮图标可静音或播放。

示例代码

具体实现代码如下，请直接复制运行测试即可。