vue_h5_tools/src/bg_sound.js

vue h5 开发小工具

import Vue from 'vue'

let canAutoplay
const audio = new Audio()
audio.loop = 9999999

// 检查是否已经自动播放音乐，已播放就忽略这次动作
function check_autoplay() {
  const use_allow = JSON.parse(localStorage.getItem('use_allow_bg_sound_play'))
  use_allow !== false && canAutoplay && audio.paused && audio.play()
}

// android  ios 内部原因 为了节省流量，规定不自动播放音频视频
// --创建页面监听，等待微信端页面加载完毕 触发音频播放
document.addEventListener('DOMContentLoaded', function() {
  check_autoplay()
  document.addEventListener('WeixinJSBridgeReady', function() {
    check_autoplay()
  }, false)
})

// 背景音乐
export default {
  audio,
  init(src, autoplay = true) {
    if (src) {
      audio.src = src
      canAutoplay = autoplay
    }
  },
  change(src) {
    audio.src = src
  },
  play() {
    audio.play()
  },
  pause() {
    audio.pause()
  },
  switch() {
    if (audio.src) {
      audio.paused ? audio.play() : audio.pause()
      localStorage.setItem('use_allow_bg_sound_play', !audio.paused)
    }
    return audio.paused
  }
}