当前位置: 代码迷 >> 综合 >> react 项目 使用react-audio-player,避免chrome无法自动开启声音问题
  详细解决方案

react 项目 使用react-audio-player,避免chrome无法自动开启声音问题

热度:84   发布时间:2024-02-23 04:56:26.0

在做一些数据进行推送告警的时候,chrome浏览器安全限制会屏蔽声音响应,解决办法可以使用 react-audio-player 插件

1.安装

npm install --save react-audio-player

2.使用 

import ReactAudioPlayer from 'react-audio-player';
import sounds from '@/assets/audio/alarm.mp3'
let audiosDom; //音频
const audioRef = useRef(null)
  <ReactAudioPlayersrc={sounds}autoPlay={false}ref={audioRef}/>

3. 播放

   audioRef.current.audioEl.current.play()

4.重载,暂停

  audiosDom = audios.currentaudiosDom.pause() //停止(暂停)audiosDom.load()  //重新加载

 

  相关解决方案