如何使用Angular 2检测用户不活动？

Question

我正在尝试创建一个Angular应用程序，其中包含用户需要在几分钟不活动后注销的视频。

• 如果用户正常或全屏观看视频，则无需注销。

• 如果选项卡处于非活动状态且视频正在播放，我需要在不活动后将其注销。

Answer 1

最简单的方法是使用idlejs 。

它适用于Angular，它包含了针对Typescript的.d.ts绑定。

import { Idle } from 'idlejs/dist';

// with predefined events on `document`
const idle = new Idle()
  .whenNotInteractive()
  .within(60)
  .do(() => console.log('Logout user with a function'))
  .start();

当用户正在播放视频时，您可以停止空闲。

play(){
    this.idle.stop();
    // play movie
}

当用户点击暂停/停止时

pause(){
    this.idle.restart();
    // pause movie
}