摇一摇交互需用 JavaScript 监听 devicemotion 事件获取加速度数据，iOS 需调用 requestPermission() 并用 accelerationIncludingGravity，通过欧氏距离差计算抖动强度并防抖，不支持时降级为点击等交互。
摇一摇交互不是靠 HTML 标签或 CSS 实现的，而是通过 JavaScript 监听设备加速度变化，识别出符合物理特征的“晃动”动作。核心在于正确使用 DeviceMotionEvent，并处理好权限、数据过滤和防抖逻辑。
必须用 devicemotion 事件，不能用 deviceorientation
deviceorientation 只提供设备朝向（α/β/γ），不反映加速度，无法判断“摇”的动作。真正要用的是 devicemotion，它每秒多次返回包含重力分量的三维加速度数据。
注意：iOS 上 e.acceleration 常为空，必须使用 e.accelerationIncludingGravity 才能拿到稳定值。
iOS 13+ 需显式申请传感器权限
从 iOS 13 开始，浏览器默认禁用运动传感器，必须在用户点击等手势回调中调用：DeviceMotionEvent.requestPermission()
否则事件监听会静默失败，控制台也不报错。Android 大部分机型默认允许，但 Chrome 92+ 同样要求 HTTPS + 用户交互后才启用。
在调试 Java 后端 API 故障时使用此技能，尤其适用于以下任务：分析日志、跨 Controller、Service 和 Mapper 层追踪请求、定位异常根因、检查 SQL 执行或参数流转，以及生成简洁的诊断结论与修复方案。
检测逻辑关键在“变化率”，不是瞬时值
手机静止时 z 轴加速度就接近 9.8，直接比对 x/y/z 绝对值极易误触发。正确做法是计算相邻两帧加速度向量的欧氏距离差，再结合时间归一化为“抖动强度”：
• 缓存上一帧的 x/y/z 值
• 每次事件中算出当前与上一帧的三维差值平方和开根
• 阈值建议从 20～30 起调，实机测试调整
• 加入 1～1.5 秒防抖，避免连续晃动多次触发
兼容性兜底不能少
不是所有设备都支持该 API：
• 先检查 if ('DeviceMotionEvent' in window)
• 不支持时降级为按钮点击或其他交互方式
• 微信内嵌 WebView 通常支持，但需确保页面是 HTTPS 协议
• 桌面浏览器基本不可用，不要依赖模拟器调试
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
