• 用chrome调试页面时,发现audio控件有时不能正常播放音频,控制台报错 Uncaught (in promise) DOMException;
  • 解决方法如下:
  • 在chrome的地址栏中输入:chrome://flags/#autoplay-policy,回车打开设置页面,在该设置改页面会看到黄色方框标记的字体:Autoplay policy ,该选项默认设置为Default,改为:No user gesture is required ,修改选项后页面下方会弹出个提示框,点击提示框上的“RELAUNCH NOW”即可。
  • 该选项修改自动播放的政策,应该可以解决chrome下视频、音频无法正常自动播放的问题(当前调试的代码中,audio没有加autoplay的属性,是事件触发播放但没有正常播放,autoplay属性无效的情况并没有测试)。
  • 之前视频无法自动播放是加了muted(静音播放)属性解决的,对于需要有声音的视频及音频来说,这个方法更适用吧

填坑——audio不能正常播放,控制台报错 Uncaught (in promise) DOMException的更多相关文章

  1. 怎样解决Chrome浏览器因为禁止音频自动播放所造成的视频无法自动播放且报错: Uncaught (in promise) DOMException的问题

    这个问题是谷歌基于用户体验方面的考虑, 对页面加载时自动播放的音频作了限制, 试想一下, 如果你打开某个页面就立刻自动播放某种不可描述的声音, 那体验想必是十分酸爽. 尽管这个设定是针对音频的, 但实 ...

  2. 网页视频不能自动播放?HTML5 video报错Uncaught (in promise) DOMException解决方法

    话说发哥四年前写了一个网页,如上图效果,实际网址http://pano.z01.com ,话说做好时是正常的,突然某一天,客户说你这个网站动画不见了,这是什么原因? 结果检查脚本一切正常. 其实也不是 ...

  3. 谷歌浏览器不能播放audio 报错Uncaught (in promise) DOMException

    在2018年4月份发布的Chrome 66正式关掉了声音自动播放,也就是说<audio autopaly></audio> <video autoplay>< ...

  4. Vue. 之 报错 Uncaught (in promise)

    Vue. 之 报错 Uncaught (in promise) 在点击同一个URL的时候,会报错如下: 解决方案: 在项目目录下运行 npm i vue-router@3.0 -S 即可.

  5. Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol')

    Vue报错: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'protocol') 报错信 ...

  6. jQuery配合html2canvas 使用时 报错 Uncaught (in promise) Provided element is not within a Document

    报错代码: 这个函数运行时 function download(){ var element = $("#demo"); //jquery 获取元素 //这里将会报错 html2c ...

  7. vue报错 Uncaught (in promise) NavigationDuplicated {_name:""NavigationDuplicated"... 的解决方法

    在进行跳转的时候报错 app.js:87499 Uncaught (in promise) NavigationDuplicated?{_name: "NavigationDuplicate ...

  8. vue 报错 Uncaught (in promise) error

    可尝试在then()后加上catch() ps:该图来自网络

  9. 登录DSCCC控制台报错提示:安装错误代码: 3

    登录DSCCC控制台报错内容:读取安装配置时出错 检查目录服务控制中心状态时出现意外错误. 显示详细资料 隐藏详细资料 安装错误代码: 3 堆栈: com.sun.directory.common.s ...

随机推荐

  1. 【转发】jquery实现自动打开新的页签

    通常我们想要浏览器在回调方法中打开一个页签,用这个方法 //window.open("http://www.baidu.com") ;       //自动打开新窗口,会被浏览器拦 ...

  2. Oracle 日期各个部分常用写法

    --1.日期的各部分的常用的的写法 --- --1) 取时间点的年份的写法: SELECT TO_CHAR(SYSDATE,'YYYY') FROM DUAL; --结果:2019 --2) 取时间点 ...

  3. IfcColumn

    IfcColumn is a vertical structural member which often is aligned with a structural grid intersection ...

  4. Vue基础知识学习笔记

    一.环境搭建1.安装nodejs ((https://nodejs.org/en/)2.安装脚手架 npm install --global vue-cli /cnmp install --globa ...

  5. python 根据生日计算年龄 sqlalchemy根据身份证号计算生日 性别

    import datetime '): birth_d = datetime.datetime.strptime(birth_s, "%Y%m%d") today_d = date ...

  6. LinkedHashMap原理

    作者:艺旭家 链接:https://www.jianshu.com/p/8f4f58b4b8ab 总结 LinkedHashMap是继承于HashMap,是基于HashMap和双向链表来实现的. Ha ...

  7. NET高级开发工程师职责要求

    岗位职责1.参与架构以及核心业务的设计:2.使用简单,干净,可维护性高,扩展性好的代码实现产品功能,并在必要时重构现有代码:3.贯彻面向接口以及模块化组件的设计理念:4.熟练RabbitMQ.ES.M ...

  8. php imagick添加文字和图片的方法

    Imagick添加文字和图片的方法<pre><?php $image = new Imagick(); $image->readImage("/home/www/wo ...

  9. Ng-Alain-mock 运用

    Ng-Alain Ng-Alian 是基于 Antd 实现的一个前端框架.它基于 Angular 和 NG-ZORRO,在此基础上进行进一步封装,是中后台的前端解决方案,为我们提供更多通用性业务模块, ...

  10. 003 SpringBoot整合SpringMVC、Mybatis 案例

    1.不使用骨架创建一个maven工程 2.修改POM.xml文件 <?xml version="1.0" encoding="UTF-8"?> &l ...