Как использовать аутентификацию Microsoft в ASP.NET Core с React

В настоящее время я пытаюсь запустить аутентификацию Microsoft на ASP.NET Core. По сути, я хочу войти в интерфейс (React) и использовать свой собственный API.
Звонок может выглядеть так

https://example.com/API/returnHelloWorld

Сейчас в React я использую @azure/msal-browser для входа в систему.
С помощью кнопки я звоню instance.loginRedirect(loginRequest), и это работает, и я могу войти в систему.

После этого я звоню

const request = {
    scopes: ["User.Read"],
    account: accounts[0]
};

instance.acquireTokenSilent(request).then(response => {
    console.info(response.accessToken);
}

где я получаю токен внутри консоли, но при проверке его на jwt.io получаю неверную ошибку подписи.

Мой authConfig.js:

import { LogLevel } from "@azure/msal-browser";
export const msalConfig = {
    auth: {
        clientId: "c0000d4e-0000-0000-0000-425000032721",
        authority: "https://login.microsoftonline.com/eace0000-0000-0000-0000-6dced0000bc/oauth2/v2.0/token",
        redirectUri: "https://example.com/signin-oidc",
    },
    cache: {
        cacheLocation: "sessionStorage",
        storeAuthStateInCookie: false,
    },
    system: {
        loggerOptions: {
            loggerCallback: (level, message, containsPii) => {
                if (containsPii) {
                    return;
                }
                switch (level) {
                    case LogLevel.Error:
                        console.error(message);
                        return;
                    case LogLevel.Info:
                        console.info(message);
                        return;
                    case LogLevel.Verbose:
                        console.debug(message);
                        return;
                    case LogLevel.Warning:
                        console.warn(message);
                        return;
                    default:
                        return;
                }
            }
        }
    }
};

export const loginRequest = {
    scopes: ["api://c0000d4e-0000-0000-0000-425000032721/.default"]
};

export const graphConfig = {
    graphMeEndpoint: "https://graph.microsoft.com/v1.0/me"
};

Теперь я отказался от создания действующего токена с помощью реакции, может быть, у кого-то есть идея, что мне нужно сделать, чтобы это исправить.

В ASP.NET Core
Внутри Program.cs я добавил

builder.Services.AddAuthentication(JwtBearerDefaults.AuthenticationScheme)
            .AddMicrosoftIdentityWebApi(options =>
            {
                builder.Configuration.Bind("AzureAd", options);
                options.Events = new JwtBearerEvents();
            }, options => { builder.Configuration.Bind("AzureAd", options); });

использовать AzureAD/Microsoft для аутентификации.

Внутри appsettings.json

  "AzureAd": {
    "Instance": "https://example.com/",
    "Domain": "local.example.com",
    "TenantId": "eace0000-0000-0000-0000-6dced0000bc",
    "ClientId": "c0000d4e-0000-0000-0000-425000032721",
    "Scopes": ".default", // also tried api://clientid/.default
    "CallbackPath": "/signin-oidc"
  }

Поскольку я хотел знать, делает ли хотя бы ASP.NET Core то, что должен был делать, я сгенерировал новый ключ, используя:

curl -X POST https://login.microsoftonline.com/eace0000-0000-0000-0000-6dced0000bc/oauth2/v2.0/token -H "Content-Type: application/x-www-form-urlencoded" -d "client_id=c0000d4e-0000-0000-0000-425000032721" -d scope=api://c0000d4e-0000-0000-0000-425000032721/.default" -d "client_secret=jtS0000SC000lorem0000000DjULkm00001aS9" -d "grant_type=client_credentials"

Это дало мне ключ с действительной подписью, но при вызове (после добавления [Authorize] в контроллер)

https://example.com/API/returnHelloWorld

с токеном я просто получаю «Ошибка носителя = «invalid_token»».

Кто-нибудь знает, как это запустить, или есть пример, на который я могу посмотреть?

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
0
127
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Прежде всего, ожидается ошибка «неверная подпись» при проверке токена на jwt.io, если вы не предоставляете открытые ключи, используемые платформой идентификации Microsoft. Для проверки вашего серверного кода вам следует использовать библиотеки, которые могут автоматически получать открытые ключи Microsoft. Вам не нужно вручную проверять эти токены на jwt.io, если вы также не предоставите открытые ключи с известного URL-адреса Microsoft (https://login.microsoftonline.com/{tenant}/v2.0/.well-known/openid-configuration).

Ваш URL-адрес authority в msalConfig кажется неверным. URL-адрес authority обычно заканчивается идентификатором вашего арендатора или «организациями», а не /oauth2/v2.0/token.

authority: "https://login.microsoftonline.com/eace0000-0000-0000-0000-6dced0000bc",

appsettings.json:

"AzureAd": {
  "Instance": "https://login.microsoftonline.com/",
  "Domain": "local.example.com",
  "TenantId": "eace0000-0000-0000-0000-6dced0000bc",
  "ClientId": "c0000d4e-0000-0000-0000-425000032721",
  "Audience": "api://c0000d4e-0000-0000-0000-425000032721",
  "CallbackPath": "/signin-oidc"
}

Ваши области loginRequest пытаются использовать область .default идентификатора вашего клиентского приложения (api://c0000d4e-.../.default). Эта область обычно подходит для получения токенов, предназначенных для API. Убедитесь, что API настроен для этой области.

Для более подробной информации вы можете обратиться к этому документу:

https://learn.microsoft.com/en-us/entra/identity-platform/scenario-protected-web-api-app-configuration?tabs=aspnetcore

https://learn.microsoft.com/en-us/samples/azure-samples/ms-identity-ciam-javascript-tutorial/ms-identity-ciam-javascript-tutorial-1-call-api-react/

Проверка подлинности Azure Не удалось выполнить проверку аудитории

Спасибо, мне наконец удалось запустить учебник. Мне пришлось заменить «tenantDomain.onmicrosoft.com» на «login.microsoft.com/tenantid», чтобы устранить «System.Net.Http.HttpRequestException: соединение SSL не может быть установлено, см. внутреннее исключение». ошибка. Теперь я смогу все запустить

darkiyy 22.04.2024 13:38

@darkiyy рад слышать, что твоя проблема решена

Jalpa Panchal 22.04.2024 14:15

Другие вопросы по теме