首页 > 其他分享 >ios系统上h5页面播放audio标签声音有延迟问题处理

ios系统上h5页面播放audio标签声音有延迟问题处理

时间:2024-05-28 09:01:00浏览次数:33  
标签:声音 audio ios h5 click 播放 延迟 页面

原文链接https://www.cnblogs.com/yalong/p/18214816

背景

app内嵌了一个H5页面,页面有个需求是点击某些按钮就触发声音,于是就使用了audio标签,但是有个问题就是在ios上,点击声音会有短时间的延迟,然后才播放声音
找了好几种方案总算解决了

方案一

click事件改为mouseup事件
因为移动端存在click300毫秒延迟,所以如果用click事件的话就会导致声音播放必定是在300毫秒之后触发的

但是改成mouseup事件后,声音播放的时间是缩短了点,但是还是有延迟

方案二

audio进页面就直接播放,不过音量设置为0,相当于在后台一直静音播放,要触发播放的时候,把声音进度设置为0,音量设置为1,播放完再把声音设置为0
这种方案是个曲线救国的方案,虽然能解决,但是代码层面会麻烦,如果有多个音效的话,会比较耗性能

方案三

使用mouseup,同时 把audio 改为audioContext,完美解决
当然 audiContext 有兼容性问题,但是如果只是用来播放声音,没使用他的高级特性的话,兼容性一般是没问题的

audioContext 了解更多可以看这里:https://developer.mozilla.org/zh-CN/docs/Web/API/AudioContext

标签:声音,audio,ios,h5,click,播放,延迟,页面
From: https://www.cnblogs.com/yalong/p/18214816

相关文章

  • iOS开发_绘制圆角矩形虚线环
    -(void)drawRect:(CGRect)rect{//获取上下文(/画笔/绘图环境)CGContextRefcontext=UIGraphicsGetCurrentContext();//小段长度CGFloatline_dash=self.height/20;//虚线的样式:长5空隙15长10空隙30长2空隙20...//CGFloa......
  • 【VMware ESXi】使用 smbiosDump 命令获取服务器硬件信息。
    ESXi5.x之前版本,通过SSH连接至ESXi主机,同常规Linux发行版一样,可以使用dmidecode命令来了解服务器的硬件信息。但在之后版本的ESXi主机上,需要使用smbiosDump命令来获取服务器硬件信息,当然运行esxcfg-info命令也可以查找主机信息,不过并没有smbiosDump命令查看方便......
  • uniapp-vue3-oadmin|vite5.x手机后台实例多端仿ios管理系统
    uniapp-vue3-oadmin手机后台实例|vite5.x+uniapp多端仿ios管理系统 原创vue3+uniapp+uni-ui跨端仿ios桌面后台OA管理模板Uni-Vue3-WeOS。uniapp-vue3-os一款基于uni-app+vite5.x+pinia等技术开发的仿ios手机桌面OA管理系统。实现了自定义桌面栅格磁贴布局、多分屏滑动管理、......
  • Android14音频进阶之AAOS之CarAudioService如何衔接AudioControl服务(七十四)
    简介:CSDN博客专家,专注Android/Linux系统,分享多mic语音方案、音视频、编解码等技术,与大家一起成长!优质专栏:Audio工程师进阶系列【原创干货持续更新中……】......
  • 【全开源】教育系统源码(支持微信小程序+移动端H5+安卓APP+IOS-APP)
    构建智慧教育的基石在当今信息化快速发展的时代,教育系统正面临着前所未有的变革。西陆教育系统源码,作为这一变革的先锋力量,以其卓越的性能和灵活性,为教育机构提供了全新的解决方案。一、源码的力量:定制化与可扩展性西陆教育系统源码的核心优势在于其高度的定制化和可扩展......
  • uniapp App去除iOS底部安全区域白边
    未设置的情况下,iOS底部安全区域白边如图:去除方法: 在 mainfest.json 中加入一下代码:"safearea":{"bottom":{"offset":"none"}},去除效果展示:......
  • 蓝牙|软件 QCC51xx系列开发之LE AUDIO Auracast使用指导
    本文适用范围:   ADK23.3~file=app1##############USERKEYS###############Thesekeysareusedtoconfigurethesoftwareortosavesettings.#Seethecorrespondingadk\src\domains\common\ps_key_map.h#USR1-Thiskeyisreserved.Itisusedto......
  • 苹果iOS 18将于6月10日登场:Apple Music支持智能歌曲过渡功能
    据AppleInsider报道,苹果将会在iOS18和macOS15上带来AppleMusic的改进,支持“智能歌曲过渡”。据悉,目前的切歌功能是“交叉渐入渐出歌曲”,带来一些平滑效果,用户可以在1-12秒之间调节。而未来iOS18和macOS15系统上将支持智能调节,利用算法来调整最佳的切歌时间。此外,苹果还在......
  • VMware ESXi 8.0U2c macOS Unlocker & OEM BIOS 标准版和厂商定制版
    VMwareESXi8.0U2cmacOSUnlocker&OEMBIOS标准版和厂商定制版ESXi8.0U2标准版,Dell(戴尔)、HPE(慧与)、Lenovo(联想)、Inspur(浪潮)、Cisco(思科)、Hitachi(日立)、Fujitsu(富士通)、NEC(日电)OEM定制版、Huawei(华为)定制版请访问原文链接:https://sysin.org......
  • VMware ESXi 8.0U2c macOS Unlocker & OEM BIOS 集成网卡驱动和 NVMe 驱动 (集成驱动
    VMwareESXi8.0U2cmacOSUnlocker&OEMBIOS集成网卡驱动和NVMe驱动(集成驱动版)发布ESXi8.0U2集成驱动版,在个人电脑上运行企业级工作负载请访问原文链接:https://sysin.org/blog/vmware-esxi-8-u2-sysin/,查看最新版。原创作品,转载请保留出处。作者主页:sysin.org202......