关于javascript:audioplay报错-Unhandled-Rejection-NotAllowedError

前景：

框架：应用umijs比拟全面框架，react栈。问题前景：    对于audio不能自动播放，这里我就不反复了，我的问题就是在iPhone机（v11.3.x）上曾经点击了按钮（和页面交互了），    还是报了 Unhandled Rejection (NotAllowedError): The request is not allowed by the user agent or the platform in the current context, possibly because the user denied permission.

排查问题：

1.通过一直排查，在交互上audio.play()是没有问题的

如下是失常播放的

 <button  onClick={() => {clickEgg(1)}}>播放</button> const clickEgg = (index) => {   let  audioEle = document.getElementById('bg-music')   audioEle.play()  };

报错状况,很多状况下，咱们须要申请接口再做某个音响播放的。就是这个同步申请就报错了

 <button  onClick={() => {clickEgg(1)}}>播放</button>let  audioEle = document.getElementById('bg-music')const clickEgg = async (index) => {  //这里有个申请  const isLogin = await getIsLoginAsync().catch(err => {    setShowLoginDialog(true)  })  if (!isLogin) {     setShowLoginDialog(true)     return;  } audioEle.play()};

解决问题：

<button  onClick={() => {clickEgg(1)}}>播放</button>let  audioEle = document.getElementById('bg-music')const clickEgg = async (index) => {   audioEle.muted = true   let p = audioEle.play()   audioEle.currentTime = 0;  //这里有个申请  const isLogin = await getIsLoginAsync().catch(err => {    setShowLoginDialog(true)  })  if (!isLogin) {     setShowLoginDialog(true)     return;  }   //为了兼容iphone    if (p !== undefined) {      p.then(() => {        audioEle.muted = false        audioEle.pause()        setTimeout(() => {          audioEle.play()        }, 0)      }).catch((e) => {        console.log(e)      })    }};

参考：https://juejin.cn/post/684490...
这篇文章写的是比拟全面，很有参考价值