解决audio控件,在chrome 控制台中报 DOMException: The play() request was interrupted by a call to pause

最新推荐文章于 2024-08-19 11:26:55 发布
最新推荐文章于 2024-08-19 11:26:55 发布
阅读量3.8k 收藏 5
点赞数
分类专栏： 工作中demo摘取
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Geezer_007/article/details/114983097
版权

在使用audio控件时会出现play()请求被pause调用中断的报错问题

具体解决办法如下：

在判断音频是不是播放之前要先调用load()方法加载音频数据；

然后再对音频进行if判断，判断之后异步处理播放或者暂停

成功回调之后进行播放或者暂停，具体看业务需求；

say个嗨呀
关注
  • 0
    点赞
  • 踩
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
uniapp - 使用 ＜video＞ 播放视频黑屏，浏览器控制台报错： DOMException: The element has on supported sources.（详细完美解决方案）
高级前端工程师
04-13 1万+
uniapp video 视频播放黑屏，uniapp 报错DOMException: The element has on supported sources.，uniapp如何解决DOMException: The element has on supported sources.，uniapp使用video标签无法播放视频出现黑屏问题处理，uniapp解决video视频黑屏显示0秒，并且浏览器报错DOMException: The element has on supported sources.，un
DOMException: The play() request was interrupted by a call to pause().
热门推荐
demon的专栏
01-29 5万+
Uncaught (in promise): The play() request was interrupted by a call to pause(). 场景 JavaScript 在调用 Audio 播放声音的时候，因为处理不当经常会出现上面的错误提示。 问题分析 在调用 Audio 的 play() 方法之后就立即被之后一次调用 pause() 方法中断了。错误提示中明确
微信小程序报错Uncaught (in promise) AbortError: The play() request was interrupted by a call to pause().
weixin_46711536的博客
10-27 3296
主要原因： =调用接口，并且接着使用返回的数据操作，因为调接口是耗时的，你的及时操作提前= 解决办法： =加定时器延迟执行操作，延时时间太少了也不行，自己测试后50分秒可以 // 播放 play:function(){ var that = this //下面的代码是关键 setTimeout(function(){ that.audioCtx.play() that.setData({state:'running'}) },50)
Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause().
weixin_34220623的博客
11-13 1万+
解决方法： audio.load() let playPromise = audio.play() if (playPromise !== undefined) { playPromise.then(() => { audio.play() }).catch(()=> { }) } 原因： 从Chrome...
Audio音频播放报The play() request was interrupted by a call to pause()问题
Jone's Area
08-13 1万+
问题分析 首先我遇到这个问题的情况是：用户刷卡播报音频，一卡一刷，报声音是没毛病， 但是如果刷的太快，那么问题就来了，上一个用户的播报还没结束，这一个播报就要覆盖上来了 系统会咋整？报错呗！ 原理很简单，前一个语音请求被下一个请求打断了呗，js肯定是听最新的命令撒。 有问题咱就解决呗 解决方案 首先我想到的是阻止新命令来覆盖，一定要等上一条命令结束了再让下一条来执行。 所以在我们之...
不同浏览器音频播放——Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause
yehaocheng520的博客
07-08 2190
之前遇到过一次关于音频播放的功能要求，文章链接如下： 音频播报功能链接地址 当时在本地谷歌浏览器下运行是没有问题。后面音频播报功能上线后，发现用户使用的是360急速模式，导致音频播报过程中报错，报错信息如下： Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause(). 本文章是在上面链接的基础上进行的改进 百度一下后，发现报这个错的原因是因为浏览器禁止音频直接播放导致的。 现在记录一
The play() request was interrupted by a call to pause()的原因及解决方案（备忘）
q140948940的博客
07-27 1万+
首先说说原因，其实就是视频（音频）加载未完成进行播放所导致的（使用错误链接播放也会有相同问题） 解决方案，前一种的话坐下判断加载是否完成即可 //video 为jq对象，原生对象把video[0]换成原生对象即可 playPromise = video[0].play(); if (playPromise) { playPromise.then(() => { // 视频频加载成功 // 视频频的播放需要耗时 setTimeout(()
在使用jplayer播放器报错The play() request was interrupted by a call to pause().怎么解决
weixin_61189391的博客
01-20 1782
就是当我们点击音乐播放时报错The play() request was interrupted by a call to pause().我试过了网络上很多的方法，但是都不可以，最终解决的方法就是 jquery的版本一定不能太高，我用的是jquery3.多的版本，最后换成了jquery.min.js就可以成功点击音乐并且播放了
HTML5：在JS中控制音频播放时报错——DOMException: play() failed because the user didn‘t interact with the document
Alice_Lee_Lee的博客
08-26 2658
说明 在谷歌浏览器中打开，在JS中指定 src，鼠标移入 div 音频播放，移出时暂停 页面 <style> div { width: 100px; height: 100px; background: tomato; margin: 100px auto; } </style> <div id="test"></div> <audio></audio>
Vue3 - 解决报错 Uncaught (in promise) DOMException: Failed to execute ‘insertBefore‘ on ‘Node‘: The node
最新发布
王佳斌
08-19 3694
vue3，报错，vue3报错，Uncaught (in promise) DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node，如何解决这个错误，动态渲染，v-if，v-show，insertBefore，详细解决方法，vue3未能在“Node”上执行“insertBefore”：要插入
element plus - 报错Uncaught DOMException: Failed to execute ‘querySelectorAll‘ on ‘Element‘: ‘x‘ is no
高级前端工程师
06-01 3436
vue3，element-plus，虚拟表格，querySelectorAll，鼠标移入表格就报错，鼠标放到表格上就会一堆报错，elementPlus虚拟化表格报错警告解决，el-table-v2，如何解决虚拟化表格警告，element plus虚拟化表格组件， [Vue warn]: Unhandled error during execution of native event handler，Uncaught DOMException: Failed to execute 'querySelector
video 标签在谷歌浏览器下报错 DOMException: play() failed because the user didn't interact
小白阿里里的博客
05-06 2598
查阅了很多博客上面都说是因为 Google Chrome 2018年1月起不再自动播放内容， 然而按照上面的解决方法在浏览器搜索框中输入：chrome://flags/ 方法是不行的 在尝试了许久之后得到以下两种解决方案可供参考： 方案一： 如果视频本身是没有声音的那么直接在 video 标签中加入 muted 即可解决 <video src="..." autoplay="autoplay...
The play() request was interrupted by a call to pause()
weixin_30770783的博客
08-16 5332
播放器在执行了play()方法后立即执行pause()所导致。 解决方法：在执行play()的时候加定时器 setTimeout(() => { $video.play(); }, 10 ); 　　 转载于:https://www.cnblogs.com/lixuemin/p/7374369.html...
video播放Uncaught (in promise) AbortError: The play() request was interrupted by a call to pause()
weixin_42792507的博客
08-08 4045
1.控制台报错： Uncaught (in promise) AbortError: The play() request was interrupted by a call to pause() 执行了play()方法以后立即执行了pause()方法，所以你让video暂停150毫秒之后再播放就不会报错了 if(video.paused || video.ended){ setTimeout(() => { video.play(); }, 200) }else{ video.pause(); }
Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause() 解决方法
老杨头的博客
02-22 2530
最后尝试更换了播放插件，视频流就能正常播放了，问题得以解决。网上搜索这个报错的处理，试过了很多都没能解决问题。
关于 Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause() 错误...
weixin_30507481的博客
12-02 5460
最近在做项目的时候发现一个如题的控制台报错。 一看右侧的报错文件是undefined 这下苦恼了，定位不到问题所在。 今天解决了这个问题，就来分享一下。 问题的关键所在是在执行了play()方法以后立即执行pause()方法。反之亦然 以下贴出代码 HTML: <button id="btn1">test</button> JS: v...
控制台报错： The play() request was interrupted by a call to pause()
m0_68094390的博客
05-29 317
在pause()之后，延时几秒play()
Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause()
02-29
Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause() 是一个在浏览器中常见的错误。它通常发生在使用 JavaScript 控制音频或视频播放时。 这个错误的原因是在调用 play() 方法之后立即调用了 pause() 方法，导致播放请求被中断。这可能是由于代码逻辑错误或用户交互引起的。 要解决这个问题，可以检查代码中是否存在不必要的 pause() 调用，或者确保在调用 play() 方法后不会立即调用 pause() 方法。另外，还可以通过添加适当的错误处理来捕获和处理这个错误，以提供更好的用户体验。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值