Блог

В настоящее время у меня есть ASP.Net Базовый веб-Api с Blazor WASM, который может успешно входить в Google OAuth с помощью компонента RemoteAuthenticatorView. Теперь я намерен передать токен, который у меня есть, в веб-api, который, надеюсь, можно использовать для аутентификации с помощью веб-api. Проблема в том, что TokenProvider .RequestAccessToken() выдает следующую ошибку.

 blazor.webassembly.js:1 Microsoft.JSInterop.JSException: An exception occurred executing JS interop: The JSON value could not be converted to System.DateTimeOffset. Path: $.token.expires | LineNumber: 0 | BytePositionInLine: 88.. See InnerException for more details.
System.Text.Json.JsonException: The JSON value could not be converted to System.DateTimeOffset. Path: $.token.expires | LineNumber: 0 | BytePositionInLine: 88.
 

             var tokenResult = await TokenProvider.RequestAccessToken();

            if (tokenResult.TryGetToken(out var token))
            {
                requestMessage.Headers.Authorization =
                  new AuthenticationHeaderValue("Bearer", token.Value);
                var response = await Http.SendAsync(requestMessage);

            }
        
 

Program.cs

             builder.Services.AddOidcAuthentication(options =>
            {
                builder.Configuration.Bind("Local", options.ProviderOptions);
                options.ProviderOptions.DefaultScopes.Add("email");
            });
 

Есть идеи? Отсутствует область видимости? Я вижу id_token в хранилище сеансов… Возможно, какой-нибудь net 5 пример Blazor WASM и core web api?

Редактировать: я вижу, что с помощью RequestAccessToken выполняется сетевой вызов для аутентификации Google, например, если бы он снова пытался пройти аутентификацию

Создайте автономное приложение Blazor для веб-сборки с отдельными учетными записями.

Замените содержимое в файле appsettings.json следующим кодом:

 {
  "Google": {
    "Authority": "https://accounts.google.com/",
    "ClientId": "11111111111-11111111111111111111111111111111.apps.googleusercontent.com",
    "DefaultScopes": [ "email" ], // The Blazor WebAssembly template automatically configures default scopes for openid and profile
    "PostLogoutRedirectUri": "https://localhost:44313/authentication/logout-callback",
    "RedirectUri": "https://localhost:44313/authentication/login-callback",
    "ResponseType": "id_token token"
  }
}
 

Запустите свое приложение и нажмите на ссылку для входа … Вы будете перенаправлены на страницу входа в Google. Аутентифицируйтесь с помощью Google…Вы перенаправляетесь в свое приложение, логин изменяется на выход из системы, и рядом с ним появляется ваше имя пользователя.

Вы можете просмотреть id_token и профиль с помощью инструментов разработчиков.

Как получить токен доступа?

Добавьте следующий фрагмент кода на свою индексную страницу и запустите…

 @page "/"
@using Microsoft.AspNetCore.Components.WebAssembly.Authentication;

@inject IAccessTokenProvider TokenProvider

<p>@output</p>

<button @onclick="DisplayToken">Display Access Token </button>

@code
{
    private string output;

    private async Task DisplayToken()
    {
        var tokenResult = await TokenProvider.RequestAccessToken();

        if (tokenResult.TryGetToken(out var token))
        {
            output = token.Value;

        }
    }

}
 

Примечание: Приведенный выше код предназначен только для демонстрационных целей (после вашего примера кода). Однако, если вы выполняете HTTP-вызов своего веб-Api с использованием службы HttpClient, токен доступа автоматически извлекается и присваивается заголовку авторизации объектом AuthorizationMessagelHandler.