基于Azure B2C自定义策略的Blazor WASM滚动登录超时实现问询

你遇到的问题本质是Azure B2C的会话管理机制和前端无活动检测的脱节——Azure B2C仅在触发认证请求（页面刷新、API静默认证）时才会检查会话状态，而前端默认不会主动触发这类检查。以下是符合Azure B2C最佳实践的标准实现方式，无需脱离身份模型：

核心思路 #

结合前端用户活动监控 + MSAL静默令牌刷新，既利用Azure B2C的会话管理能力，又实现前端无活动超时的用户体验。

具体实现步骤 #

1. 保留Azure B2C自定义策略配置 #

你之前的Rolling会话配置是正确的，继续保留：

<SingleSignOn Scope="Application" />
<SessionExpiryType>Rolling</SessionExpiryType>
<SessionExpiryInSeconds>900</SessionExpiryInSeconds>

这个配置确保后端API和Azure B2C的会话会按规则过期，前端只需配合触发检查即可。

2. 前端实现用户活动监控 + 静默刷新 #

在Blazor的全局布局组件（比如MainLayout.razor）中添加以下逻辑：

@inject MsalAuthenticationService MsalService
@inject NavigationManager NavManager
@inject IJSRuntime JSRuntime
@implements IDisposable

@code {
    private Timer _inactivityTimer;
    // 和Azure B2C会话超时保持一致
    private const int InactivityTimeoutSeconds = 900;
    // 提前30秒尝试刷新令牌，避免突然登出
    private const int RefreshBufferSeconds = 30;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            // 注册浏览器用户活动监听
            await JSRuntime.InvokeVoidAsync("setupInactivityListener", DotNetObjectReference.Create(this));
            ResetInactivityTimer();
        }
    }

    // 供JS调用，检测到用户活动时重置计时器
    [JSInvokable]
    public void UserActivityDetected()
    {
        ResetInactivityTimer();
    }

    private void ResetInactivityTimer()
    {
        _inactivityTimer?.Dispose();
        // 设置超时时间
        _inactivityTimer = new Timer(async _ => await HandleTimeout(), null, 
            TimeSpan.FromSeconds(InactivityTimeoutSeconds), Timeout.InfiniteTimeSpan);
    }

    private async Task HandleTimeout()
    {
        var account = await MsalService.GetAccountAsync();
        if (account == null) return;

        try
        {
            // 静默刷新令牌，触发Azure B2C会话检查
            var result = await MsalService.AcquireTokenSilent(new[] { "your-api-scope" }, account).ExecuteAsync();
            // 刷新成功，重置计时器
            ResetInactivityTimer();
        }
        catch (MsalUiRequiredException)
        {
            // 会话已过期，执行登出并跳转登录页
            await MsalService.LogoutAsync(new LogoutRequest { PostLogoutRedirectUri = NavManager.BaseUri });
        }
    }

    public void Dispose()
    {
        _inactivityTimer?.Dispose();
    }
}

3. 添加JavaScript活动监听 #

在wwwroot/js下创建inactivity.js文件：

window.setupInactivityListener = (dotNetRef) => {
    // 监听常见用户活动事件
    const activityEvents = ['mousedown', 'mousemove', 'keydown', 'scroll', 'touchstart'];
    
    const notifyBlazor = () => {
        dotNetRef.invokeMethodAsync('UserActivityDetected');
    };

    activityEvents.forEach(event => {
        document.addEventListener(event, notifyBlazor, { passive: true });
    });
};

然后在index.html中引入该脚本：

<script src="js/inactivity.js"></script>

方案优势 #

• 完全基于Azure B2C身份模型，无需单独维护自定义超时状态，符合安全规范
• 前端监控用户实际活动，避免无操作时强制登出，同时在超时前自动尝试刷新会话
• 利用MSAL的静默刷新机制，自动同步Azure B2C的会话状态，确保前后端会话一致性

内容的提问来源于stack exchange，提问作者americanslon