Blazor 在 X 量空闲时间后执行某些操作



在这方面,我对blablaor和核心相当陌生。

我的问题是我有一个以 API 为中心的应用程序,它将对 api 进行登录调用并获得 JWT 令牌。我需要找到一种方法在一段时间空闲时间后将用户注销并清除我正在保存的 JWT 令牌。

我在某处读到他们从未添加过检测 Blazor 中空闲时间的方法,但我很好奇是否有人对此有解决方案。

使用 JavaScript onmousemove 和 onkeypress 事件来触发 Razor 组件中的 Timer 函数可以识别用户是处于活动状态还是非活动状态。如果用户未执行任何鼠标移动或按键事件,则认为用户处于非活动状态,并在一定时间间隔后调用 Timer 函数以 [执行要执行的任何操作。

  1. 打开 _Host.cshtml 并按如下所示更新它。在 JavaScript 中调用 onmousemove 和 onkeypress 属性 函数,用于在 Razor 组件中触发计时器函数。

<body>
// . . .
<script>
function timeOutCall(dotnethelper) {
document.onmousemove = resetTimeDelay;
document.onkeypress = resetTimeDelay;

function resetTimeDelay() {
dotnethelper.invokeMethodAsync("TimerInterval");
}
}
</script>
</body>

  1. 现在打开 MainLayout.razor 并调用 Timer 方法来识别用户是否处于活动状态。当发现用户处于非活动状态时,可以在方法中添加代码
@using System.Timers
@inject IJSRuntime JSRuntime

// . . .
@code {
private Timer timerObj;

protected override async Task OnInitializedAsync()
{
// Set the Timer delay.
timerObj = new Timer(7000);
timerObj.Elapsed += UpdateTimer;
timerObj.AutoReset = false;
// Identify whether the user is active or inactive using onmousemove and onkeypress in JS function.
await JSRuntime.InvokeVoidAsync("timeOutCall", DotNetObjectReference.Create(this));
}

[JSInvokable]
public void TimerInterval()
{
// Resetting the Timer if the user in active state.
timerObj.Stop();
// Call the TimeInterval to logout when the user is inactive.
timerObj.Start();
}

private void UpdateTimer(Object source, ElapsedEventArgs e)
{
InvokeAsync(async() => {
// ======> DO WHATEVER YOU WANT TO DO HERE <======
});
}
} 

相关内容

  • 没有找到相关文章

最新更新