解决苹果Safari 浏览器下html不能自动播放声音和视频的问题-实时语音通话功能【唯一客服】
在实现我的客服系统中,实时语音通话功能的时候,如果想自动播放音视频流,在苹果设备上遇到了问题。
苹果浏览器(Safari)在默认情况下不允许声音在背景里自动播放。这是出于用户体验和隐私方面的考虑,避免在用户没有意识到的情况下自动播放声音。
解决办法是
iOS 11 及以上版本的 Safari 浏览器。当用户已经有过至少一次交互以后,可以设置下面两个属性,muted
和 playsinline
属性。然后动态js设置一下,就能自动播放声音了
<audio id="myAudio" src="audio.mp3" muted playsinline></audio>
然后在js里动态设置一下属性
var myAudio = document.getElementById('myAudio'); myAudio.muted = false; // 将 muted 属性设置为 false myAudio.autoplay = true; // 将 autoplay 属性设置为 true myAudio.play(); // 播放音频
这样
在页面至少有过交互以后,可以让苹果设备上自动播放声音了
十年开发经验程序员,离职全心创业中,历时三年开发出的产品《唯一客服系统》
一款基于Golang+Vue开发的在线客服系统,软件著作权编号:2021SR1462600。一套可私有化部署的网站在线客服系统,编译后的二进制文件可直接使用无需搭开发环境,下载zip解压即可,仅依赖MySQL数据库,是一个开箱即用的全渠道在线客服系统,致力于帮助广大开发者/公司快速部署整合私有化客服功能。
开源地址:唯一客服(开源学习版)
官网地址:唯一客服官网