three.js+cannon.js开发FPS游戏时movementX读数异常问题

不存在比event.movementX/Y精度更高的原生鼠标移动量获取接口。你遇到的数值跳变是Pointer Lock API存在多年的跨浏览器已知问题，和精度无关，常见触发场景包括：指针刚锁定的初始帧、窗口失焦后重新获焦、系统高DPI/鼠标加速度适配异常、鼠标瞬时触碰窗口边界。

所有Web端FPS项目均通过多层防护逻辑解决该问题，无需替换原生API：

• 跳过指针锁定后的初始异常帧
  指针锁定成功后，浏览器返回的前1-3帧movement值是鼠标从原位置瞬移到屏幕中心的偏移量，不属于玩家实际操作，直接丢弃即可。
• 单帧移动量阈值过滤
  正常操作下，单帧（约16ms）内鼠标移动像素存在物理上限。可根据当前设置的鼠标灵敏度，计算出玩家最快转动180度对应的单帧移动像素值，取该值的1.5倍作为单帧最大允许偏移阈值，超过阈值的数值直接判定为异常，用上一帧的有效移动值兜底。
• 可选滑动窗口平滑
  如果需要更稳定的视角表现，可以缓存最近3-4帧的有效移动值，取平均值后再应用到视角旋转。注意窗口长度不要超过5帧，否则会出现明显的操作延迟拖影。

修正后的核心参考代码如下：

// 作用域内提前声明缓存变量
let lastMoveX = 0;
let lastMoveY = 0;
let readyToReadMove = false;
const MAX_SINGLE_FRAME_MOVE = 80; // 根据自身灵敏度调整，建议实测后设置

// 监听指针锁定状态变化
document.addEventListener('pointerlockchange', () => {
    scope.isLocked = document.pointerLockElement === document.body;
    readyToReadMove = false;
    if (scope.isLocked) {
        // 跳过前两帧异常数据
        requestAnimationFrame(() => {
            requestAnimationFrame(() => {
                readyToReadMove = true;
                lastMoveX = 0;
                lastMoveY = 0;
            })
        })
    }
})

function onMouseMove( event ) {
    if ( scope.isLocked === false || !readyToReadMove ) return;
    let movementX = event.movementX || event.mozMovementX || event.webkitMovementX || 0;
    let movementY = event.movementY || event.mozMovementY || event.webkitMovementY || 0;

    // 异常值过滤
    if (Math.abs(movementX) > MAX_SINGLE_FRAME_MOVE) {
        movementX = lastMoveX;
    }
    if (Math.abs(movementY) > MAX_SINGLE_FRAME_MOVE) {
        movementY = lastMoveY;
    }

    // 缓存本次有效值供下次兜底
    lastMoveX = movementX;
    lastMoveY = movementY;

    scope.euler.y -= movementX * scope.rotationSpeed;
    scope.euler.x -= movementY * scope.rotationSpeed;
    scope.euler.x = Math.min(Math.max(scope.euler.x, -1.0472), 1.0472);
    camera.quaternion.setFromEuler(scope.euler);
    scope.dispatchEvent( _changeEvent );
}

注意：不要尝试通过mousemove事件的clientX/clientY计算偏移量替代movementX/Y。指针锁定状态下系统会强制将鼠标拉回屏幕中心，自行计算的差值误差远大于原生API的异常概率，完全不适合FPS视角控制场景。

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