谷歌浏览器声频自动播放解决

1、

  created () {
    let that = this;
    // console.log(that.source)
    //调用main.js的计时器
    this.neworderPlay(
      function (isPlay) {
        // console.log("请求成功");
        that.source = isPlay;
        // console.log(that.source)
        if (that.source) {
          var musicEle0 = document.getElementById('music_mp3_0');
          musicEle0.src = "https://yidekuai.jidiankj.cn/yidekuai/voice/neworder.mp3";
          //主要是oncanplay 这个方法，上面不用ifram也行，用audio标签，但是西药设置浏览器安全设置那个
          musicEle0.oncanplay = function () {
            musicEle0.play();
          }
        };
      }
    )
  },

main.js

//初始化定时器
let timer = null;
//neworderPlay函数挂载在vue原型上，供任何地方this.调用
Vue.prototype.neworderPlay = function(caback){ 
    if(timer){
       clearInterval(timer);
    }
    // console.log("我在main.js",sessionStorage.getItem("token"))
         if(sessionStorage.getItem("token")) {
            // console.log("我登录了")
           timer = setInterval(() => {
            // console.log("计时器在运行")
            axios({
                method: 'post',
                url: '/shoppc/checkExistsNewOrder',
            }).then(res =>{
                // console.log(res)
                if(res.data.success){
                    // console.log(res.data.data.hasNewOrder)                   
                    let isPlay = res.data.data.hasNewOrder;//是否有新的订单
                    // if(res.data.data.hasNewOrder){
                        caback(isPlay);
                    // }
                }
            })
        },30000)
     }else{
     //    console.log(!sessionStorage.getItem("token"))
        // console.log("我清楚计时器了")
        timer= null
        clearInterval(timer);//为什么计时器还在运行，退出登录重新登录计时器不是从零开始吗
    }
};

2、不用ifram的话。需要到浏览器安全隐私那里设置

image.png

image.png

image.png

image.png

image.png

添加播放音频的url