H5 - 获取手机陀螺仪
直接上代码:
// 获取手机陀螺仪
var updateGravity = function(event) {
console.log("alpha:",event.alpha); // X
console.log("beta:",event.beta); // Y
console.log("gamma:",event.gamma); // Z
};
// 监听 window 的 deviceorientation 事件
window.addEventListener('deviceorientation', updateGravity, false);
ios系统需要 https:// 协议才能获取。
目前ios最新版本 13以上需要申请用户权限:window.DeviceOrientationEvent.requestPermission();
$('.Gravity').on('click',function(){ // ios 提示授权, 返回的是一个 promise window.DeviceOrientationEvent.requestPermission() .then(state => { if(state === "granted"){//允许 alert("允许使用陀螺仪:",state) }else if(state === "denied"){//拒绝 alert("拒绝使用陀螺仪:",state) }else if(state === "prompt"){ alert("用户进行其他操作:",state) } }) })
目前发现需要使用 click / touched 等点击事件才能去触发使用,需要注意,一旦点击了确定或者拒绝,系统就会保留授权权限,不会再弹出提示框,需要重新授权就要完全退出app等程序再次进入。
在手机端上才能测试使用,在PC端浏览器中会报错!
在PC 端中使用浏览器调试