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

Nit*_*hin 7 javascript browser angular

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

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

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

rjd*_*olb 6

最简单的办法,是使用idlejs.

它适用于Angular,它包含.cript.的.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();
Run Code Online (Sandbox Code Playgroud)

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

play(){
    this.idle.stop();
    // play movie
}
Run Code Online (Sandbox Code Playgroud)

当用户点击暂停/停止时

pause(){
    this.idle.restart();
    // pause movie
}
Run Code Online (Sandbox Code Playgroud)