vue使用windows自带能力播放音频

场景:

当vue开发web端系统的时候,想播放一些自定义音频。例如播放一些系统信息的时候,就可以使用这个原生的能力。不局限于播放mp3等格式的固定音频。

注意:浏览器有限制,需要点击一下界面,或者说界面有点击操作,才会触发语音播放,默认进来不点击界面,无论怎么自动调用都是不起效的

代码实现:
//播放操作
playAudio(){
    //没开声音就不再播放
    if(window.localStorage.volume!='true')return
    //初始化一次
	let to_speak = new SpeechSynthesisUtterance();
    to_speak.voiceURI = 'Google 普通话(中国大陆)';
    to_speak.rate = 1;
    to_speak.volume = 100

    to_speak.text = '的升级附加赛速度和加速度仅仅是'
    //播放语音
    window.speechSynthesis.speak(to_speak);
    // console.log('这个呀',to_speak)
  },
  touchClick(){
    //切换声音开关   
    //关闭  就cancel这个队列
    //打开  就正常执行
    new Promise((r)=>{
      this.volume = !this.volume
      r()
    }).then(()=>{
      if(!this.volume){
        //关闭就立即停止
        window.speechSynthesis.cancel();
      }
    })
    window.localStorage.volume = this.volume
  },

你可能感兴趣的:(vue,vue.js,windows,音视频)