gpt4 book ai didi

typescript - Aurelia 应用程序中的不活动注销

转载 作者:搜寻专家 更新时间:2023-10-30 20:56:23 25 4
gpt4 key购买 nike

tl;dr,对于 Aurelia,我如何从 View 模型外部调用 View 模型内部的函数?

我需要对一段时间未执行操作(路由更改、向服务器请求等)的用户执行客户端注销。看完这篇GitHub issue我创建了一个不活动注销 View 和 View 模型,并将其合并到我的 app.html 和我的 attached() 函数中,我启动计时器并在时间到期时注销用户。

这一切都很好,但我遇到了一个问题,让我觉得所有这些都是一个巨大的兔子洞。如何从 View 模型外部调用我的 resetInactivityTimer() 函数,是否可以使类中的一个函数可公开调用?就像执行对服务器的请求时,我想从我的服务类中调用 resetInactivityTimer() 函数

inactivity-logout.ts

import {Aurelia} from 'aurelia-framework';
import {Router} from 'aurelia-router';
import {inject} from 'aurelia-dependency-injection';

@inject(Aurelia, Router)
export class InactivityLogout {
inactivityWarningDuration: number; // how long should the warning be up
initialInactivityWarningDuration: number; // how long should the warning be up
inactivityDuration: number; // how long before we warn them
inactivityIntervalHandle: any;

constructor(aurelia, router) {
this.aurelia = aurelia;
this.router = router;
this.initialInactivityWarningDuration = 5;
this.inactivityWarningDuration = this.initialInactivityWarningDuration;
this.inactivityDuration = 5;
}

attached() {
this.queueInactivityTimer();
}

resetInactivityTimer(){
$("#LogoutWarningPopup").modal("hide");

this.inactivityWarningDuration = this.initialInactivityWarningDuration;
clearInterval(this.warningInterval);
this.queueInactivityTimer();
}

queueInactivityTimer(){
clearTimeout(this.inactivityIntervalHandle);

this.inactivityIntervalHandle = setTimeout(() => {
this.displayWarning();
}, 1000 * this.inactivityDuration);
}

displayWarning(){
$("#LogoutWarningPopup").modal({ backdrop: 'static', keyboard: false });
this.warningInterval = setInterval(()=>{
this.inactivityWarningDuration--;
if(this.inactivityWarningDuration <= 0){
clearInterval(this.warningInterval);
this.logout();
}
}, 1000); //start counting down the timer
}

logout(){
$("#LogoutWarningPopup").modal("hide");
console.log("due to inactivity, you've been logged out.")
this.aurelia.setRoot('views/login');
}
}

app.html

    <require from='./inactivity-logout.js'></require>
<inactivity-logout></inactivity-logout>

search-service.ts

    performSearch(searchText: String) {

/*
* Stuff here to reset inactivity timer
*/

return this.httpClient.put("/api/Search", searchText)
.then(response => {
return response;
});
}

最佳答案

全局事件的好方法是将 PubSub 模式与 aurelia-event-aggregator 库一起使用。

import {Aurelia} from 'aurelia-framework';
import {Router} from 'aurelia-router';
import {inject} from 'aurelia-dependency-injection';
import {EventAggregator} from 'aurelia-event-aggregator';

@inject(Aurelia, Router, EventAggregator)
export class InactivityLogout {
inactivityWarningDuration: number; // how long should the warning be up
initialInactivityWarningDuration: number; // how long should the warning be up
inactivityDuration: number; // how long before we warn them
inactivityIntervalHandle: any;

constructor(aurelia, router, ea) {
this.aurelia = aurelia;
this.router = router;
this.initialInactivityWarningDuration = 5;
this.inactivityWarningDuration = this.initialInactivityWarningDuration;
this.inactivityDuration = 5;
this.ea = ea;

// subscribe
this.sub = this.ea.subscribe(RefreshInactivity, msg => {
console.log(msg.value);
});

// to unsubscribe somewhere
// this.sub.dispose()
}
...

}

export class RefreshInactivity {

constructor(value) {
this.value = value;
}

}

在应用中某处发送事件

 this.ea.publish(new RefreshInactivity('some value'));

关于typescript - Aurelia 应用程序中的不活动注销,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38101153/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com