17

我已经使用 javascript 实现了会话超时警告，它只是询问用户是否要延长会话或注销。问题在于，这是针对 Intranet 门户的，其中高级用户通常会同时向应用程序打开多个浏览器窗口或选项卡。目前，将提示他们即将从每个浏览器窗口中注销。如何使代码更智能以检测他们正在积极使用另一个浏览器会话？

4

4 回答 4

2

您必须使用 Ajax 检查服务器上的会话状态并跟踪用户拥有的所有打开的会话/窗口。然后，您将能够仅针对其中一个带有注销警告的可用会话。

回应您的评论：

不要使用内置的会话机制，使用服务器端的持久数组或数据库日志来设计自己的。

不，HTTP 请求中的任何内容都不会告诉您打开了多少浏览器，但是您可以在用户打开每个浏览器窗口时分配自己的 sessionID cookie。对服务器进行 Ajax 调用，查看用户是否超时，如果您是会话日志中最低（或最后）的条目，那么您就是收到警告的浏览器。

于 2008-12-12T19:19:57.357 回答
2

您不能指望所有选项卡/窗口都属于同一个会话，因为它们可以生成并包含在单独的进程中，而您对此没有太多控制权。

但是，如果您的代码引用了 Javascript cookie，您可以通过回发（同步或异步 AJAX）检查您的伪会话状态。但是，您依赖于在用户浏览器上启用的 cookie。

于 2008-12-12T20:49:49.310 回答
0

这行得通吗？

存储一个 Javascript cookie 并检查以确定会话是否已在另一个选项卡中扩展？

看起来这确实有效......

于 2008-12-12T20:11:11.013 回答
0

安装 @ng-idle @ng-idle 可通过 NPM 获得。通过运行安装它：

npm install --save @ng-idle/core @ng-idle/keepalive angular2-moment

设置您的应用程序模块 打开 src/app/app.module.ts 并使用导入 Ng2IdleModule

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { NgIdleKeepaliveModule } from '@ng-idle/keepalive'; // this includes the core NgIdleModule but includes keepalive providers for easy wireup

import { MomentModule } from 'angular2-moment'; // optional, provides moment-style pipes for date formatting

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    MomentModule,
    NgIdleKeepaliveModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

然后在 component.ts

import { Component } from '@angular/core';

import {Idle, DEFAULT_INTERRUPTSOURCES} from '@ng-idle/core';
import {Keepalive} from '@ng-idle/keepalive';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

    currentPath: String;

    idleState = 'Not started.';
    timedOut = false;
    lastPing?: Date = null;

    constructor(private idle: Idle, private keepalive: Keepalive, location: Location, router: Router) {

        // sets an idle timeout of 5 seconds, for testing purposes.
        idle.setIdle(5);

        // sets a timeout period of 5 seconds. after 10 seconds of inactivity, the user will be considered timed out.
        idle.setTimeout(5);

        // sets the default interrupts, in this case, things like clicks, scrolls, touches to the document
        idle.setInterrupts(DEFAULT_INTERRUPTSOURCES);

        idle.onIdleEnd.subscribe(() => this.idleState = 'No longer idle.');

        idle.onTimeout.subscribe(() => {
            this.idleState = 'Timed out!';
            this.timedOut = true;
        });

        idle.onIdleStart.subscribe(() => this.idleState = 'You\'ve gone idle!');
        idle.onTimeoutWarning.subscribe((countdown) => this.idleState = 'You will time out in ' + countdown + ' seconds!');

        // Sets the ping interval to 15 seconds
        keepalive.interval(15);

        keepalive.onPing.subscribe(() => this.lastPing = new Date());

        // Lets check the path everytime the route changes, stop or start the idle check as appropriate.
        router.events.subscribe((val) => {

            this.currentPath = location.path();
            if(this.currentPath.search(/authentication\/login/gi) == -1)
                idle.watch();
            else
                idle.stop();

        });
    }

    reset() {
        this.idle.watch();
        this.idleState = 'Started.';
        this.timedOut = false;
    }
}
于 2019-09-25T10:10:31.113 回答