如何在Device Orientation（设备方向）功能中获取报错信息？

1. 兼容性检测阶段报错捕获 #

首先判断当前浏览器是否支持相关API，直接捕获不兼容场景的报错：

if (!window.DeviceOrientationEvent) {
  console.error('当前运行环境不支持Device Orientation API，无法使用设备方向相关功能');
}

2. 权限申请阶段报错捕获 #

目前主流浏览器（Chrome 74+、Safari 13+等）都要求用户主动授权才能访问设备方向数据，权限申请是异步操作，可通过try/catch捕获申请过程中产生的所有错误：

// 注意：权限申请必须在用户交互事件（如点击、触摸）的回调中触发，否则会直接抛出错误
async function applyOrientationPermission() {
  try {
    const permissionResult = await DeviceOrientationEvent.requestPermission();
    if (permissionResult === 'granted') {
      // 授权成功，绑定设备方向监听事件
      window.addEventListener('deviceorientation', handleOrientationChange);
    } else {
      console.error(`权限申请被拒绝，状态为：${permissionResult}`);
    }
  } catch (error) {
    console.error('权限申请过程出现错误，错误信息：', error.message, '完整错误对象：', error);
  }
}

3. 运行时错误捕获 #

绑定专属的设备方向错误事件，监听API运行过程中产生的硬件、系统级报错：

window.addEventListener('deviceorientationerror', (errorEvent) => {
  console.error('设备方向运行错误，错误码：', errorEvent.code, '错误描述：', errorEvent.message);
});

常见的错误场景包含：设备无对应传感器、传感器数据读取失败、页面处于无权限状态下尝试读取方向数据等。

内容的提问来源于stack exchange，提问作者Mohammad Khashei