微信IOS中摇一摇无法播放声音

Raaabbit 发布于2019-08-20 17:35 / 3143人阅读

摘要：但在微信浏览器中，我们可以添加来解决这一问题。摇一摇若上述解决方案依旧无法播放声音，可以简单采用下面这种方法使用这种解决方案只能满足微信浏览器在端还是会存在无法播放声音问题上面采用的手机摇一摇事件库推荐的手机音频播放库花神的博客简书大俊

Description

IOS系统中无法自动播放media，必须由用户发出交互动作（如click, touchstart）才能播放。

但在微信浏览器中，我们可以添加WeixinJSBridgeReady Listener来解决这一问题。

Page

JavaScript

var audio = document.getElementById("audio_start_shake");
document.addEventListener("WeixinJSBridgeReady", function weixinjsbridgeready() {
    audio.load();
}, false);

//摇一摇Listener
window.addEventListener("shake", function shakeListener() {
    audio.play()
}, false);

若上述解决方案依旧无法播放声音，可以简单采用下面这种方法

var audioAutoPlay = function (el) {
    var audio_el = document.getElementById(el);
    audio_el.play();
    
    document.addEventListener("WeixinJSBridgeReady", function () {
        audio_el.play();
    }, false);    
}

//使用
audioAutoPlay("audio_start_shake")

Option

这种解决方案只能满足微信浏览器,在PC端还是会存在无法播放声音问题

上面采用的手机摇一摇事件库
推荐的手机音频播放库

References

alanoy.com
花神的博客
简书-Leo_大俊

GPU云服务器云服务器中摇一摇 ios 摇一摇问题微信摇一摇Demo 微信摇一摇红包

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/83699.html

微信页面监听摇一摇事件，并伴有音效

摘要：原文出处最近要写一个微信网页，需要监听手机摇动事件，并且伴随有声音在，事件特性的运动传感器的封装时间装置，你可以通过改变运动时间获取设备的状态，加速和其他数据有另一个角度事件提供设备，定位等信息。原文出处：http://i.jakeyu.top/2016/05/0... 最近要写一个微信网页，需要监听手机摇动事件，并且伴随有声音在HTML5，devicemotion事件devic...

fuchenxuan 2019-08-20 12:05 评论0 收藏0
React-Native 真的是移动开发的未来吗

摘要：在版本上，安卓系统上的渲染就有锯齿，后来我们不分效果是使用图片实现的，汗啊第三方组件不全。摇一摇问题的解决在我们使用了等状态管理时，热更新不会更新这些代码，而频繁摇一摇实在是太累了。此时可以使用此时相当于虚拟了一个摇一摇事件。公司本年度有App任务，陆陆续续用RN开发了两个应用。一款是涉及仪器控制的平板项目，另一款是客户端的App。下文谈谈使用RN开发的部分认知(其实只是随便扯一扯，...

thursday 2019-08-22 18:20 评论0 收藏0