一个不寻常的谷歌键盘漏洞

主要观点:在 Android 系统上某些网站使用 Gboard(谷歌键盘)时会出现细微的 bug,如在《卫报》纵横填字游戏和 TypeScript 游乐场中,输入“test”后删除单词需按 4 次 Backspace 键,此 bug 并非在所有地方都出现,iOS 键盘及 iOS 上的 Gboard 无此问题,似乎是 Android 上 Gboard 的特有问题。
关键信息:

  • Gboard 在其 keydown/keypress/keyup 浏览器事件中未发出正确的 keyCode。
  • 通常输入字母时浏览器应触发相应 keyCode 的事件,而 Gboard 生成自动完成建议时 Backspace 的 keyCode 为 229,不生成建议时为 8。
  • 此 bug 在 Chrome 和 Firefox 上 Android 系统中表现不同,推测是 Gboard 问题。
  • 解决办法是在输入元素上监听“beforeinput”事件,并检查“inputType”是否为“deleteContentBackward”,在 React 中需注意合成事件的问题。
    重要细节:
  • 在《卫报》纵横填字游戏中,输入“T-E-S-T”后需按 4 次 Backspace 键字母才开始删除。
  • 在 TypeScript 游乐场也有此 bug。
  • 在普通 HTML 输入字段中 Backspace 工作正常。
  • 展示了不同浏览器和键盘下的键盘事件视频,如 Chrome 130、macOS 15 下的桌面事件,Gboard 中的键盘事件等。
  • 给出了具体的代码示例来解决监听 Backspace 键的问题,包括普通 JavaScript 和 React 中的用法。
阅读 5
0 条评论