Blazor webassembly scoped service to store jwt token in Browser

Question

I have a scoped service in blazor webassembly that its methods are called from a custom AuthenticationStateProvider the name of the service is UserService, Inside this I have these methods:

 private async Task PersistUserToBrowser(string token) =>
        _http.DefaultRequestHeaders.Add("Authorization", $"Bearer {token}");
    //await _js.SetProperty("jwt", token);
    
    public async Task<User?> FetchUserFromBrowser()
    {
        string token = null;
        try
        {
            token = _http.DefaultRequestHeaders.GetValues("Authorization")?.FirstOrDefault();
        }
        catch { return null; }
        if (token == null) return null;
        //var token = await _js.GetProperty("jwt");            
        var claimsPrincipal = CreateClaimsPrincipalFromToken(token);
        var user = User.FromClaimsPrincipal(claimsPrincipal);
    
        return user;
    }
    
    /*logout*/
    
    public async Task ClearBrowserUserData() => _http.DefaultRequestHeaders.Remove("Authorization");
    //await _js.SetProperty("jwt", "");

js is a jsInterop service that is using IJsruntime to store and retrieve token. As shown I commented these because probably IJSRuntime not working at this stage.

So I used Request Headers to store the token, But this also not working.

So How do I store my token in the browser inside this scoped service in blazor webassembly client project?