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

尽管这个设定是针对音频的, 但实际上还影响了视频的自动播放, 因为视频也是有声音的!!!!

因此, 解决这个报错的方法很简单: 将给video标签加上一个muted属性即可, 这样就相当于告诉谷歌浏览器, 这个视频是安全的, 可以默默播放.

<body>

  <video src="..." autoplay muted></video>

</body>

声音可以在后续加上, 比如用户点击了页面, 这时就可以把muted设为false.

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

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

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

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

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

  3. 解决Chrome浏览器无法自动播放音频视频的问题，Uncaught (in promise) DOMException

    转载自:http://www.nooong.com/docs/chrome_video_autoplay.htm 在最新版的Chrome浏览器(以及所有以Chromium为内核的浏览器)中,已不再允许 ...

  4. vue中解决chrome浏览器自动播放音频 和MP3语音打包到线上

    一.vue中解决chrome浏览器自动播放音频 需求 有新订单的时候,页面自动语音提示和弹出提示框: 问题 chrome浏览器在18年4月起,就在桌面浏览器全面禁止了音视频的自动播放功能.严格地来说, ...

  5. 解决chrome浏览器对于自动填充的input表单添加的默认的淡黄色背景问题 && 一般的浏览器input和button的高度不一致问题

    解决chrome浏览器对于自动填充的input表单添加的默认的淡黄色背景问题 如果我们把一个表单设置位 autofocus ,这时这个表单在获取焦点后就会产生淡黄色的背景,我们就是使用!importa ...

  6. 解决chrome浏览器在win8下没有注册类的问题

    解决chrome浏览器在win8下没有注册类的问题 新建一个txt,里面存放代码 Windows Registry Editor Version 5.00 [HKEY_LOCAL_MACHINE\SO ...

  7. 最简单的解决Chrome浏览器主页被hao123、360和2345篡改的方法是什么

    最简单的解决Chrome浏览器主页被hao123.360和2345篡改的方法是什么 一.总结 一句话总结:打开chrome的安装目录,将chrome.exe改成chrome1.exe即可,然后发送一个 ...

  8. 解决chrome浏览器无法得到window.showModalDialog返回值的问题

    父页面处理: function ProductList() {   var TypeID = window.document.getElementById("Type").valu ...

  9. 解决Chrome浏览器自动记录用户名和密码的黄色背景问题和该解决方法与tab切换至下一个input冲突的问题。

    哈哈哈,是不是标题很长呀,不逗你们了.其实这么长的标题主要就说了两件事: 第一件:解决Chrome浏览器自动记录用户名和密码的黄色背景问题. 第二件:输入完用户名后按下tab键切换至下一个输入密码in ...

随机推荐

  1. Alpha项目冲刺！ Day1-领航

    各个成员在 Alpha 阶段认领的任务 成员 任务 任务时长 林恩 项目进度签到代码审核与签入撰写博客协调组内合作 50 寇永明 美工和部分后台编写 30 杨长元 安卓端搭建 45 胡彤 服务器框架搭 ...

  2. 安装kvm安装虚拟机centos

    1 安装阿里云的镜像站 #将原来的镜像备份 cd /etc/yum.repos.d/ mkdir back mv CentOS-Base.repo ./back/ # 安装阿里的镜像 wget -O ...

  3. Vue引入远程JS文件

    问题 最近在使用 Vue 做东西,用到钉钉扫描登录的功能,这里需要引入远程的 js 文件,因为 Vue 的方式跟之前的不太一样,又不想把文件下载到本地应用,找了一下解决的方法,貌似都需要引入第三方的库 ...

  4. Expression: __acrt_first_block == header

    File: minkernel\crts\ucrt\src\appcrt\heap\debug_heap.cpp Line: 996 Expression: __acrt_first_block == ...

  5. 阶段5 3.微服务项目【学成在线】_day18 用户授权_05-方法授权-方法授权测试

    这是我们课程的服务里面 加了授权的方法 重启课程管理的服务 首先需要登陆 在redis复制token 访问课程列表 用最新复制的令牌 最新token可以 调用teachplan方法 调用 一个没加注解 ...

  6. 安装mycat

    1.下载mycat 为了方便,我已经下载下来.我选择的版本是1.6版本 2.解压,安装在/home/xm6f/dev目录下 cd /home/xm6f/devtar -zxvf Mycat-serve ...

  7. iOS 点击空白处收回键盘的几个简单代码

    //收回键盘1 -(void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event { [self.view.subviews enumer ...

  8. 动态PHP电商网站伪静态的 Nginx反向代理Cache缓存终极设置

    转自: http://www.ttlsa.com/nginx/dynamic-php-nginx-cache/

  9. node.js连接DB2实现fetchRows一行一行获取sql的源码

    参见程序中的queryResult那部分: /* * This example demonstrates how to fetch a single row from a large table * ...

  10. 在Eclipse Android中设置模拟器屏幕大小

    在Eclipse Android中设置模拟器屏幕大小是本文要介绍的内容,主要是来了解并学习Eclipse Android中模拟器的设置,具体关于Eclipse Android内容的详解来看本文. 方法 ...