PeerStream更新-按键偶发不释放

转载

wx58c63c4796010 2024-02-26 17:01:03

文章标签 github 失去焦点问题排查 文章分类 HarmonyOS 后端开发

前言

最近有多位群友反馈PeerStream在使用过程中出现键盘不释放的情况，特别是在进行人物移动的时候，通过WASD控制人物行走，按键不释放会导致人物失去控制，一直向前。
https://github.com/inveta/peer-stream/issues/149

PeerStream更新-按键偶发不释放_github

问题排查

首先我们参考官方的demo，发现也存在如下问题，测试视频如下：

我们发现当按键按住之后，如果突然失去焦点，就会导致不会发送按键释放命令。这个问题必现，例如通过ctrl+shift+A会呼出chrome弹窗，弹出后会导致PeerStream失焦。

PeerStream更新-按键偶发不释放_失去焦点_02

问题解决

我们定义一个集合保存按下的键盘

keysDown = new Set()

之后在键盘按下的时候，将其插入集合，再键盘释放的时候，删除集合，如果突然拾取焦点，就把按键进行释放。

this.onkeydown = (e) => {
   const keyCode = SpecialKeyCodes[e.code] || e.keyCode
   this.dc.send(new Uint8Array([SEND.KeyDown, keyCode, e.repeat]));
   this.keysDown.add(keyCode)
  };

this.onkeyup = (e) => {
   const keyCode = SpecialKeyCodes[e.code] || e.keyCode
   this.dc.send(new Uint8Array([SEND.KeyUp, keyCode]));
   this.keysDown.delete(keyCode)
  };

this.onblur = e => {
   this.keysDown.forEach(keyCode => {
    this.dc.send(new Uint8Array([SEND.KeyUp, keyCode]));
   })
   this.keysDown.clear()
  }