更新记录
1.0.1(2024-09-10) 下载此版本
[修复] 解决类型报错问题 [新增] 兼容Vue2
1.0.0(2024-09-10) 下载此版本
第一个版本
平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
× | × | × | × | × | × | × |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
× | × | × | × |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | × | × | × | × | × |
y-bg-music 自动播放背景音乐
仅微信内置浏览器支持,进入页面自动播放。无需“触摸、点击”之类的操作。
使用简单
演示效果
使用微信扫一扫查看效果
使用
Vue2将下述代码放到首页 onLoad 中即可
<script lang="ts" setup>
import { useBgMusic } from '@/uni_modules/y-bg-music/js_sdk';
const bgmusic = useBgMusic({
src: 'https://superzdd.github.io/wechat-h5-backgound-music-survey/bgmusic.mp3',
loop: 999, // 循环次数
controls:true // 显示右上角控制元素
});
// 留空也要调用一下,否则无法自动播放
weixin.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识
timestamp: 0, // 必填,生成签名的时间戳
nonceStr: '', // 必填,生成签名的随机串
signature: '', // 必填,签名,见附录1
jsApiList: [ ]
});
weixin.ready(() => {
bgmusic.play(); // 播放~
});
</script>
常见问题
-
播放控制元素太丑
答:可以隐藏的,然后自己写一个替代。
参考
技术实现思路来自 superzdd 大佬的开源仓库 微信端H5背景音乐自动播放研究
意见反馈、联系我
绿泡泡:Base1024