ios audio不能够正常播放
ios中audio不能直接通过audio.play()播放,需要用户在click事件或者touch事件中执行audio.play()才能播放。
ajax回调中audio.play()音乐不能正常播放。
用户点击按钮,等服务器返回数据后再播放相应的成功或失败的音乐,测试在ios中不能正常播放。猜测ios中的audio不能再ajax回调函数中
play()
下面记录一下ios中ajax回调中播放音乐的问题解决过程
解决方案一 --降低音量
在用户点击时间后将audio的音量设置为0,等success后将音量设置为1; volume可以控制audio的音量大小,取值范围为 0~1
audio.volume=number
发现在chrome的手机模式可以将音乐静音,ios中竟然不能控制音量,好吧这个被ios屏蔽了。放弃了。。。
解决方案二 --播放后立即暂停
用户点击按钮后立即播放音乐,等ajax返回数据后再继续播放。测试能够正常播放。部分代码如下:
// 用户click事件
if (this.isIOS()) { // ios单独处理 安卓不需要
this.$refs.audio.play()
this.$refs.audio.pause()
}
// ajax成功后的事件
this.$refs.audio.pause()
this.$refs.audio.currentTime = 0
this.$refs.audio.play()
由于是vue项目,所以代码中有this.$refs小伙伴们别介意;
总结
在ios中,如果需要播放音乐或者视频,需要用户手动触发事件在调用
.play()才能播放(autoplay或者直接.play()是不能直接触发的);如果需要在
ajax回调函数中播放音乐,需要在用户触发事件后播放音乐立即暂停然后才能在回调函数中.play(),不然ios中是播放不成功的。
ios audio不能够正常播放的更多相关文章
- iOS audio不支持循环播放
解决办法:监听播放完成事件(注意点,audio标签不能设置循环播放,去除标签 loop="loop"或者 loop="false",不然不走播放完成事件) $( ...
- 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- audio标签的自动播放(ios)
0.应用场景 前端移动端开发,经常有播放音乐的需求.比如我有公司做过类似支付宝的年度账单,功能是用户在查看年度账单的过程中播放轻音乐. 1.audio标签播放mp3 (一)常用属性和API介绍 1.c ...
- ios audio不能自动播放
今天做了一个简单的落地页项目,就是类似于手机微信上经常看到的滑动效果.因为公司要求需要自己开发,所以我就用swiper+swiper.animate开发,开发速度很快,只不过最后音乐哪里出现了一点小b ...
- iOS Dev (20) 用 AVAudioPlayer 播放一个本地音频文件
iOS Dev (20) 用 AVAudioPlayer 播放一个本地音频文件 作者:CSDN 大锐哥 博客:http://blog.csdn.net/prevention 步骤 第一步:在 Proj ...
- iOS Dev (21) 用 AVPlayer 播放一个本地音频文件
iOS Dev (21) 用 AVPlayer 播放一个本地音频文件 作者:CSDN 大锐哥 博客:http://blog.csdn.net/prevention 前言 这篇文章与上一篇极其相似,要注 ...
- AVAudioSession(1):iOS Audio Session 概览
本文转自:AVAudioSession(1):iOS Audio Session 概览 | www.samirchen.com 本文内容主要来源于 Audio Session Programming ...
- iOS中声音采集与播放的实现(使用AudioQueue)
都说iOS最恶心的部分是流媒体,其中恶心的恶心之处更在即时语音. 所以我们先不谈即时语音,研究一下,iOS中声音采集与播放的实现. 要在iOS设备上实现录音和播放功能,苹果提供了简单的做法,那就是利用 ...
- 如何让音频跟视频在ios跟android上自动播放
如何让音频跟视频在ios跟android上自动播放 <audio autoplay ><source src="audio/alarm1.mp3" type=&q ...
随机推荐
- foreach 改变集合时不能使用
使用foreach循环遍历list集合时,出现Collection was modified; enumeration operation may not execute.这个错误,查了半天才发现是当 ...
- laravel报错 : No application encryption key has been specified.
创建了新的laravel项目后, 运行提示:No application encryption key has been specified 解决方法: 这个是由于没有配置好 APP_KEY 在终端上 ...
- 分析vue脚手架
执行流程: 执行npm run serve.找到了main.js文件,之后引入Vue.App等等.后来找到App组件,发现里面用到了组件School,于是执行School组件,最终汇总到App组件.通 ...
- svn服务支持网页显示并增加在线预览功能,支持视频在线播放
1.svn服务器支持网页显示 VisualSVN Server是一个非常不错的SVN Server程序,方便,直观,用户管理也异常方便.不过,它本身并没有提供在线修改密码的功能.由于在实际使用过程中, ...
- centos5 源失效解决办法
将源文件备份 [base] name=CentOS-$releasever - Base failovermethod=priority baseurl=http://vault.centos.org ...
- 爬虫中网络请求的那些事之urllib库
目录 爬虫之网络请求中的那些事 urllib库 urlopen函数 urlretrieve函数 urlencode.parse_qs函数 urlparse.urlsplit函数: request.Re ...
- 如果一个service服务出现异常,无响应,如何定位,定位过程
假设一个service服务出现异常,要如何定位
- [happyctf]部分writeup
题目名称:sqltest所属:MISC考察点:盲注 眼力 耐心(好吧是废话) 附件下载下来 ,到手一个流量包,用wireshark打开,大致浏览了一下,抓的应该是盲注的数据流量. 这里有一个经验问题, ...
- 论文翻译:2018_Source localization using deep neural networks in a shallow water environment
论文地址:https://asa.scitation.org/doi/abs/10.1121/1.5036725 深度神经网络在浅水环境中的源定位 摘要: 深度神经网络(DNNs)在表征复杂的非线性关 ...
- JavaScript day03 循环
循环 while循环 循环是重复性做一件事情 没有办法控制每次循环的时间长度 循环会增大程序时间复杂度(不建议无限循环嵌套 一般情况下不会嵌套超过两次) 死循环 是不会停止的循环 会导致电脑内存溢出 ...