如何在Ng-Idle中仅保留键盘、鼠标点击事件作为闲置中断源

解决方案 #

不要直接修改NgIdle库的源码，该库本身提供了自定义中断事件的官方API，按以下步骤修改即可：

1. 导入EventTargetInterruptSource类

import { EventTargetInterruptSource } from '@ng-idle/core';

2. 自定义符合需求的中断源数组，替换默认的DEFAULT_INTERRUPTSOURCES

// 仅保留键盘输入、鼠标点击作为闲置计时中断事件
const customInterruptSources = [
  // 监听全局键盘按下事件
  new EventTargetInterruptSource(document, 'keydown'),
  // 监听全局鼠标按下事件
  new EventTargetInterruptSource(document, 'mousedown')
];

3. 替换原配置中的中断源设置
   把原有代码里的
   idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);
   替换为
   idle.setInterrupts(customInterruptSources);

可选优化 #

如果需要过滤无效键盘操作（比如单纯按下Ctrl/Shift/Alt等功能键不算有效输入），可以给中断源添加过滤逻辑：

const customInterruptSources = [
  new EventTargetInterruptSource(document, 'keydown', 300, (event: KeyboardEvent) => {
    // 可根据业务需求调整过滤规则
    return !event.ctrlKey && !event.altKey && !event.metaKey && !['Shift', 'CapsLock', 'Tab'].includes(event.key);
  }),
  new EventTargetInterruptSource(document, 'mousedown')
];

注意 #

之前修改库文件不生效的原因是修改的是编译后的产物，每次重新安装依赖、执行构建操作时都会被官方包覆盖，且这种修改方式不符合可维护性要求，优先使用官方开放的配置API。

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