Я пытаюсь войти в систему с Microsoft Azure.
Что работает до сих пор:
- При использовании
loginPopup().then(response => console.log(response)
меня просят войти в систему, а затем получить токен, который Я печатаю здесь. Для меня это означает, что все настроено и правильно сконфигурировано. - Пользовательский опыт не беспокоит пользователя всплывающими окнами, а вместо этого использует
loginRedirect()
. Меня снова просят войти в систему, и после этого я перенаправлен на зарегистрированный URI (AuthPage).
Перехват:
- Зарегистрированная функция обратного вызова никогда не вызывается. Я хочу сохранить полученный токен в приложении и настроить различные маршруты при входе пользователя в систему. Почему обратный вызов не вызывается?
- Если я не использую
msalObj.handleRedirectCallback(callback);
, я получаю сообщение об ошибке. Очевидно, должна быть установлена некоторая функция обратного вызова. - Зачем мне нужен обратный вызов, если я все равно перенаправлен на redirectURI и могу извлечь токен из URL?
Источники, которые я нашел наиболее полезными:
import React from 'react';
import { Configuration, UserAgentApplication } from "msal";
export const LoginPage = (props) => {
const submitHandler = (e) => {
const msalConfig = {
auth: {
clientId: `${process.env.REACT_APP_AAD_CLIENT_ID}`,
authority: `${process.env.REACT_APP_AAD_AUTHORITY}/${process.env.REACT_APP_AAD_TENANT_ID}`,
redirectUri: `${process.env.REACT_APP_AAD_REDIRECT_URI}`,
},
cache: {
cacheLocation: "localStorage",
storeAuthStateInCookie: true
}
};
const requestObj = {
scopes: ["user.read"]
};
const callback = (error, response) => {
console.log(response);
props.onRedirect(error, response);
};
e.preventDefault();
const msalObj = new UserAgentApplication(msalConfig);
msalObj.handleRedirectCallback(callback);
msalObj.loginRedirect(requestObj);
};
return (
<>
<h2>Login</h2>
<hr />
<form onSubmit={submitHandler}>
<button type="submit">Login with Azure</button>
</form>
</>
);
};