vue 音频问题

Posted 2020-10-01 情绪控攻城狮

技术点:

在weakpack配置音频文件:

{
    test: /\.mp3(\?.*)?$/,
    loader: ‘url-loader‘,
    options: {
        limit: 15000,
        name: utils.assetsPath(‘media/[name].[hash:7].[ext]‘)
    }
},
一定注明音频大小限制(微信崩溃);
在static中建个audio文件放音频;
技术点二:
微信背景音乐自动播放:

function audioAutoPlay() {
    ground.load();
    ground.play();
    document.addEventListener("WeixinJSBridgeReady", function () {
        ground.load();
        ground.play();
    }, false);
}
audioAutoPlay();
ios/安卓必须由事件触发:
技术点三:
检测锁屏/后台切换状态

document.addEventListener("visibilitychange", function() {
    let audio = document.getElementById(‘music‘);
    if(!document.hidden){
        audio.play();
    }else{
        audio.pause()
    }