苹果浏览器不自动播放audio

2024-08-29

解决audio 在部分移动端浏览器不能自动播放（目前包括ios、微博）

问题描述:项目需要在页面加载完成后自动播放音乐,但在ios中却无法自动播放,需要用户主动触发解决办法: $('html').one('touchstart',function(){ document.getElementById('audio2').play();}); (只触发一次) 解决在微信浏览器中ios audio无法自动播放 <!DOCTYPE HTML> <html> <head> <meta charset="utf-8">

在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"

[JavaScript] audio在浏览器中自动播放

audio 在浏览器中自动播放 autoplay 属性 autoplay 属性规定一旦音频就绪马上开始播放. 如果设置了该属性,音频将自动播放. 使用 autoplay 属性进行播放 //使用autoplay属性 var src = "./award.wav"; var body = document.getElementsByTagName("body")[0]; if (body.getElementsByTagName("audio").l

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

转载自:http://www.nooong.com/docs/chrome_video_autoplay.htm 在最新版的Chrome浏览器(以及所有以Chromium为内核的浏览器)中,已不再允许自动播放音频和视频.(Google的某些做法还真是令开发者不爽).就算你为video或audio标签设置了autoplay属性也一样不能自动播放. <video autoplay></video> 1 如果你用 javascript 代码显式调用play方法,你将会在控制台看到如下异常

ios微信浏览器音乐自动播放

setTimeout(function(){ //一般情况下,这样就可以自动播放了,但是一些奇葩iPhone机不可以 document.getElementById('bgmedia').play(); //微信必须加入Weixin JSAPI的WeixinJSBridgeReady才能生效 document.addEventListener("WeixinJSBridgeReady", function () { document.getElementById('bgmedia')[

ios html5 audio 不能自动播放

//修复ios 浏览器不能自动播放音频的问题在加载时创建新的audio 用的时候更换src即可 Xut.fix = Xut.fix||{}; if (Xut.plat.isBrowser && Xut.plat.isIOS) { var isAudio = false var fixaudio = function() { if (!isAudio) { isAudio = true; Xut.fix.audio = new Audio(); document.removeEventLi

解决audio和video在手机端无法自动播放问题

各大浏览器都为了节省流量,做出了优化,在用户没有行为动作时(交互)不予许自动播放 <audio src="music/bg.mp3" autoplay loop controls>你的浏览器还不支持哦</audio> <audio controls="controls"> <source src="music/bg.ogg" type="audio/ogg"></sourc

egret 篇——关于ios环境下微信浏览器的音频自动播放问题

前段时间公司突然想用egret(白鹭引擎)做一个金币游戏,大半个月边看文档边写吭哧吭哧也总算是弄完了.期间遇到一个问题,那就是ios环境下微信浏览器的音频自动播放问题. 个人感觉吧,egret自己封装的audio还是不太健壮.群里,社区呼声一片,相信前端的很多人都碰到过这个问题.而网上随便search一下答案很快就出来了.这里就先copy一份答案吧. <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js">&l

手机浏览器自动播放视频video（设置autoplay无效）的解决方案

1.问题的提出某一天接了个需求,需要在手机的H5页面内加入视频,我开开心心做完,准备交付的时候,问题来了,PM想要用户一进入页面,视频就开始播放,不需要用户手动点击. 2.尝试解决加autoplay "视频自动播放"这个需求是ok的,那我就在video标签上加个autoplay属性嘛,在PC端浏览器里面试了一下,运行流畅,没有遇到什么问题,但是放在手机浏览器里面打开,就跟没设置autoplay是一样的. 监听canplay 那不行的话,我在页面加载完成的时候,监听video的can

微信h5页面audio标签在ios下不能自动播放

背景介绍:在一个h5页面中,当用户提交表单到后台,后台返回的结果成功的话,开始自动播放背景音乐出现的问题:在安卓手机上正常,iOS中没有反应后来网上一番搜索后了解到时因为iOS不允许自动播放音乐,除非用户做出了交互行为解决方案:1.如果是在页面刚加载就需要自动播放音频的话还是比较好办的,可以利用微信提供的api来实现(应该是内部做了一些修改) // 通过config接口注入权限验证配置后, 在 ready 中 play 一下 audio function autoPlayAudio1()

video 安卓ios系统浏览器全屏播放以及自动播放的问题

ios自动播放 <body onload="load()"> <div class="result_box"> <div class="video"> <video src="***.mp4" class="video" webkit-playsinline="true" id="myvideo"></video&

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

在2018年4月份发布的Chrome 66正式关掉了声音自动播放,也就是说<audio autopaly></audio> <video autoplay></video>在桌面版浏览器也失效. 页面在用户没有操作的情况下播放声音会出现报错: 图片示例: 代码示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT

如何让音频跟视频在ios跟android上自动播放

如何让音频跟视频在ios跟android上自动播放 <audio autoplay ><source src="audio/alarm1.mp3" type="audio/mpeg"></audio> 系统默认情况下 audio的autoplay属性是无法生效的,这也是手机为节省用户流量做的考虑. 如果必须要自动播放,有两种方式可以解决. 1.捕捉一次用户输入后,让音频加载,下次即可播放. //play and pause it

解决H5微信浏览器中audio兼容-- 背景音乐无法自动播放

我们知道,ios 在safari浏览器中,audio标签不能在没有用户交互的情况下自动播放或有js直接控制播放,这是系统限制的一些原因. 但是背景音乐在微信浏览器可以设置自动播放,config配置一下就ok! 1.引入Js文件在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.4.0.js 2.通过config接口注入权限验证配置 wx.config({ // 配置信息, 即使不正确也能使用 wx.read

【转】解决chrome浏览器不支持audio和video标签的autoplay自动播放

声音无法自动播放这个在 IOS/Android 上面一直是个惯例,桌面版的 Safari 在 2017 年的 11 版本也宣布禁掉带有声音的多媒体自动播放功能,紧接着在 2018 年 4 月份发布的 Chrome 66 也正式关掉了声音自动播放,也就是说 <audio autopaly> <video autoplay>在桌面版浏览器也将失效. 那么怎么解决呢?解决方式如下: 在chrome 浏览器中输入:chrome://flags,搜索“Autoplay policy”,默认为

HTML5中的audio在手机端和微信端的自动播放

再做H5页面的时候,发现audio在手机端和微信端添加了autoplay以后还是不可以自动播放,这是因为手机端为了节约流浪所设置的通常解决方法是给一个交互事件,一定要是交互事件标签:<audio loop src="/photo/aa.mp3" id="audio" autoplay preload="auto">该浏览器不支持audio属性</audio> 里面的属性我就不多做解释了,可以自己百度解决方法: //-

iOS下Audio自动播放(Autoplay)音乐

前几天做了一个H5活动页面,产品要求初始化播放音乐,因晓得H5 Audio标签支持Autoplay就没在意. 完了在手机上测试,发现手机上打开页面死活就是不会自动播放,点击播放按钮才可以播放,很是纠结. 然后网上查了下发现iOS上禁止了Audio的Autoplay属性,原因如下: User Control of Downloads Over Cellular Networks In Safari on iOS (for all devices, including iPad), where th

移动端audio自动播放问题

中秋临近,心血来潮想做个手机端贺卡,以前接触的移动端较少,虽然是个简单的贺卡,其实也蛮多坑的,简略说一下在制作贺卡的过程遇到的坑: 一:移动端的屏幕大小不能算作body的大小,因为手机浏览器头部都有网址导航等等,底部也有留白,应该出去这一部分: 二:audio背景音乐是不能自动播放的,不管怎么调试js都没用,经过多方查证,居然是移动端做了限制,一定要用户交互才能触发,网上的解决方案大多是通过touchstart事件: <audio id="myaudio" > <so

audio元素和video元素在ios和andriod中无法自动播放

原因: 因为各大浏览器都为了节省流量,做出了优化,在用户没有行为动作时(交互)不予许自动播放: /音频,写法一 <audio src="music/bg.mp3" autoplay loop controls>你的浏览器还不支持哦</audio> //音频,写法二 <audio controls="controls"> <source src="music/bg.ogg" type="audio

[bug]解决chrome浏览器不支持所有媒体音乐不自动播放问题

声音无法自动播放这个在 IOS/Android 上面一直是个惯例,桌面版的 Safari 在 2017 年的 11 版本也宣布禁掉带有声音的多媒体自动播放功能,紧接着在 2018 年 4 月份发布的 Chrome 66 也正式关掉了声音自动播放,也就是说 <audio autopaly> <video autoplay>在桌面版浏览器也将失效. 那么怎么解决呢?解决方式如下:在chrome 浏览器中输入:chrome://flags,搜索“Autoplay policy”,默认

苹果浏览器不自动播放audio

热门专题