摇一摇交互需用 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 + 用户交互后才启用。
检测逻辑关键在“变化率”，不是瞬时值
手机静止时 z 轴加速度就接近 9.8，直接比对 x/y/z 绝对值极易误触发。正确做法是计算相邻两帧加速度向量的欧氏距离差，再结合时间归一化为“抖动强度”：
• 缓存上一帧的 x/y/z 值
• 每次事件中算出当前与上一帧的三维差值平方和开根
• 阈值建议从 20～30 起调，实机测试调整
• 加入 1～1.5 秒防抖，避免连续晃动多次触发
立即学习“Java免费学习笔记（深入）”；
兼容性兜底不能少
不是所有设备都支持该 API：
• 先检查 if ('DeviceMotionEvent' in window)
• 不支持时降级为按钮点击或其他交互方式
• 微信内嵌 WebView 通常支持，但需确保页面是 HTTPS 协议
• 桌面浏览器基本不可用，不要依赖模拟器调试
