移动端浏览器IOS13以上,陀螺仪调用注意事项

移动端iOS更新到13版本以后,全景图、AR等场景陀螺仪失效解决方案如下:

  1. 需要HTTPS协议
  2. 隐私设置开启运动传感器
  3. 监听事件代码调整,iOS13以后会新增window.DeviceOrientationEvent的API,orientationchange的事件用于处理横竖屏转换,没用到可忽略。要额外注意的是其触发条件与音视频自动播放的安全协议相同,需要用户交互事件的主动触发例如点击事件之后(此处特指onClick事件,常规框架里用touch封装的tap事件容易失效)。监听添加代码如下:
		// iOS 13+

		if ( window.DeviceOrientationEvent !== undefined && typeof window.DeviceOrientationEvent.requestPermission === 'function' ) {

			window.DeviceOrientationEvent.requestPermission().then( function ( response ) {

				if ( response == 'granted' ) {

					window.addEventListener( 'orientationchange', onScreenOrientationChangeEvent, false );
					window.addEventListener( 'deviceorientation', onDeviceOrientationChangeEvent, false );

				}

			} ).catch( function ( error ) {

				console.error( 'Unable to use DeviceOrientation API:', error );

			} );

		} else {

			window.addEventListener( 'orientationchange', onScreenOrientationChangeEvent, false );
			window.addEventListener( 'deviceorientation', onDeviceOrientationChangeEvent, false );

		}
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值