IOS微信音乐播放问题

IOS Safari 的Audio支持

Audio标签为html5中新增的标签，各种浏览器的支持情况大概如下：

新特性：

但这边要注意的是移动平台并不能很好的兼容autoplay属性以及preload属性。
实际问题参见右侧传送门：HTML5 Audio在iOS设备上的问题

应该是苹果公司为了节省用户的流量在移动设备上主动禁用了这些标签。

主要可以看iOS的开发者页面Safari HTML Audio&Video Guide
尤其是iOS-Specific Considerations选项。

总而言之，在iOS的Safari上，音频不能被自动播放，需要一个交互来触发它。

解决方案

<html>
<head>...</head>
<body>
<audio preload="preload" id="car_audio" src="media/bgMusic.mp3" loop></audio>
<!--a sample audio-->
<!--use weixin API--><script>setTimeout(function(){$(window).scrollTop(1);},0);document.getElementById('car_audio').play();document.addEventListener("WeixinJSBridgeReady", function () {WeixinJSBridge.invoke('getNetworkType', {}, function (e) {document.getElementById('car_audio').play();});}, false);</script>
</body>
</html>

这一段能够在iOS微信段实现自动播放，原理是，Weixin对于浏览器的操作是介于APP层面的，相当于一次模拟用户操作，能够触发Safari的audio进行播放。

特别记录一下。折磨了我一周的问题。
之后会写一段模拟操作的代码来尝试一下。
先到这里为止。

IOS微信音乐播放问题相关推荐

html防微信音乐,web高仿樊登H5/微信音乐播放悬浮球效果
这两天完成了一个仿樊登 H5 的音乐播放悬浮球效果,这个效果跟微信音乐播放悬浮球的效果也很相似,今天总结一下实现的思路过程(基于 Vue 实现). 先来看看樊登 H5 的效果. 再来看看我的实现,挺完 ...
微信公众号教程（18）微信音乐播放器开发上
微信音乐播放器开发原文:http://www.cnblogs.com/imaker/p/6252638.html 一.Html5的audio组件 HTML5 有两个很炫的元素,就是Audio和 ...
ios开发---音乐播放器之怎么获取音乐列表
博主刚学ios开发不久,最近想要自己写一个音乐播放器.结果昨天关于怎么获取音乐列表的问题在网上找了好久,今天想要把我昨天找到的资料和学到的东西记录下来. 方法一: 这个方法是通过获取到沙盒路径,来得到 ...
[微信音频播放器] html5 audio 制作的微信播放器
weixinAudio.js 一个简单的微信样式播放器播放器DOM及CSS是微信里内置的音频播放器的样式,重新创建了控制层js,方便在在公众号,APP等场景使用. 例子 demo 地址 github ...
微信开发常见问题：自动音乐播放，alert 显示网址
前言在做各种HTML5场景页面的时候,插入背景音乐是一个很普遍的需求.我们都知道,IOS下的safari是无法自动播放音乐的,以至一直以来造成一种错误的认识,iso是无法自动播放媒体资源的.直到微信 ...
2023基于微信小程序的音乐播放器+后台管理系统(SSM+mysql)-JAVA.VUE毕业设计源码论文(论文+开题报告+运行)
摘要随着信息化时代的到来,各种程序都趋向于智能化.系统化:微信音乐播放器小程序也不例外,目前国内的市场仍都使用人工管理,随着市场规模越来越大,信息量也越来越庞大,人工管理显然已无法应对时代的变化, ...
微信中音乐播放在ios不能自动播放解决
在微信中,ios手机下面音乐被自动禁掉无法自动播放,我们可以执行触发body上的元素,自动进行播放. //音乐var x = document.getElementById("myAudio ...
iOS高仿微信悬浮窗、忍者小猪游戏、音乐播放器、支付宝、今日头条布局滚动效果等源码...
iOS精选源码 iOS WKWebView的使用源码模仿apple music 小播放器的交互实现高仿微信的悬浮小窗口 iOS仿支付宝首页效果 [swift]仿微信悬浮窗类似于今日头条,网易新闻 ...
微信播放在服务器视频无法播放音乐,【bug解决】ios微信浏览器中背景音乐无法播放...
我记得之前在一次项目中,出现过浏览报错: 所以在这次H5的制作中,我使用了iframe来加载音频文件,使用这种方式后,电脑端是没有问题的,但是当上传至服务器上在手机上浏览时,会出现点击音乐旋转按钮无法 ...
ios html5 audio mp3,H5 audio 微信端在IOS上不能播放音乐
前言在做各种HTML5场景页面的时候,插入背景音乐是一个很普遍的需求.我们都知道,iOS下的safari是无法自动播放音乐的,以至一直以来形成了一种认知,iOS是无法自动播放媒体资源的.直到微信火爆 ...

IOS微信音乐播放问题

IOS Safari 的Audio支持

解决方案

IOS微信音乐播放问题相关推荐

最新文章

热门文章