ios重力感应失效—deviceMotion及deviceOrientation事件不触发

Posted autofelix

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ios重力感应失效—deviceMotion及deviceOrientation事件不触发相关的知识,希望对你有一定的参考价值。

〝 古人学问遗无力,少壮功夫老始成 〞

deviceMotion及deviceOrientation事件不触发,常码字不易,出精品更难,没有特别幸运,那么请先特别努力,别因为懒惰而失败,还矫情地将原因归于自己倒霉。你必须特别努力,才能显得毫不费力。如果这篇文章能给你带来一点帮助,希望给飞兔小哥哥一键三连,表示支持,谢谢各位小伙伴们。

目录

一、发现问题

二、问题原因

三、授权优化

四、陀螺仪插件


一、发现问题

  • 摇一摇功能,无法触发 devicemotion 事件
  • 导致手机重力感应功能失效
//原生js监听陀螺仪事件
​​​​if (window.DeviceMotionEvent) {
    window.addEventListener('devicemotion', function () {
        var acceleration = event.accelerationIncludingGravity;
        var x = acceleration.x;
        var y = acceleration.y;
        var z = acceleration.z;
        // you can do something
    }, false);
}

二、问题原因

  • 重力感应需要使用 https 协议,http下不工作
  • ios13+系统后,苹果手机提高用户隐私安全性,导致重力感应需要用户主动触发才可以使用
  • 苹果授权时候,会弹出comfirm弹窗,确认是否授权重力感应,暂时有三个返回值。
  • 如果在http下,授权只会返回denied,所以确认在https下
  •  这里需要注意,如果用户取消了授权,将在短时间内无法再次授权使用,因此可以在授权前进行提示,提高用户体验性
  • 目前确认主动触发的事件可以是click,touch等
  • 授权授权触发代码如下
//IOS13+ 授权流程
window.DeviceOrientationEvent.requestPermission()
    .then(state => {
        switch (state) {
            case "granted":
                // you can do something
                break;
            case "denied":
                alert("你拒绝了使用陀螺仪");
                break;
            case "prompt":
                alert("其他行为");
                break;
        }
});

三、授权优化

DeviceMotionEvent.requestPermission().then(function (state) {
    if ('granted' === state) {
       window.addEventListener('devicemotion', function () {
           // you can do something
       }, false);
    } else {
        alert('apply permission state: ' + state);
    }
}).catch(function(err){
    alert('error: ' + err);
});

四、陀螺仪插件

  • orienter插件,是第三方用户自己封装的关于陀螺仪方法
  • 该插件如有需要请自行下载引入
var o = new Orienter();

o.onOrient = function (obj) {

    var alpha = obj.a; //左右
    var beta= obj.b; //前后
    var gamma= obj.g; //扭转
    var longitude= obj.lon; //纬度
    var latitude= obj.lat; //精度

};

o.on();

 

以上是关于ios重力感应失效—deviceMotion及deviceOrientation事件不触发的主要内容,如果未能解决你的问题,请参考以下文章

H5之重力感应篇

ios整理小应用-重力感应

摇一摇事件

重力感应器都有哪些工作原理

重力感应游戏可行性办法研究_完结

cocoscreator重力感应事件回调用