如果我们想要在一个页面自动播放背景音乐或是其他音频，在真机上往往需要使用一些其他方法才可以，比如ios是没办法调用audio.play()事件直接调用，非得添加手动点击事件才可以。接下来就说说我在项目里遇到的困难和解决办法

情况1、如是在单独的h5页面，无路由，这种情况就必须加个引导按钮点击它，或是在页面全局设置一个点击事件one，当用户第一次且仅第一次碰到页面就播放，除此之外别无他法。

情况2、如果是当用户使用hash或者有路由跳转的情况，可以使用在跳转页添加全局audio对象的方式来控制。这里使用vue举例：首先可在router/index.js里设置window.audio=null,在跳转前的页面new一个video 并将此对象赋予window.audio，然后即可在下一个页面使用audio对象。代码：

/router/index.js/
window.bgMusic=null;

跳转页面 跳转事件

const audio = new Audio();
audio.addEventListener('canplay', () => {audio.play()});
audio.loop = true;
audio.src = mathBgVoice;
audio.load();
bgMusic = audio;
this.$router.replace('math_graduation')

这样处理以后，在跳转页面先寻找播放时机，等跳转到播放音乐的页面即可实现‘自动播放背景音乐’的功能。

链接: https://fly63.com/article/detial/1679