diff options
Diffstat (limited to 'microservices/04-react-app')
| -rw-r--r-- | microservices/04-react-app/README.md | 5 | ||||
| -rw-r--r-- | microservices/04-react-app/src/contexts/AuthContext.jsx | 7 |
2 files changed, 8 insertions, 4 deletions
diff --git a/microservices/04-react-app/README.md b/microservices/04-react-app/README.md index 8daba90..37bb944 100644 --- a/microservices/04-react-app/README.md +++ b/microservices/04-react-app/README.md @@ -1,2 +1,5 @@ -# OAuth2 secured api gateway access +# A React.js frontend that uses an OAuth2 secured api gateway to access backend services +# Login, logout, determining user roles + +Look at the contexts/AuthContext.jsx
\ No newline at end of file diff --git a/microservices/04-react-app/src/contexts/AuthContext.jsx b/microservices/04-react-app/src/contexts/AuthContext.jsx index 9bb5937..c02b7a8 100644 --- a/microservices/04-react-app/src/contexts/AuthContext.jsx +++ b/microservices/04-react-app/src/contexts/AuthContext.jsx @@ -9,7 +9,7 @@ export function AuthProvider({ children }) { const [user, setUser] = useState(null); useEffect(() => { - // Fetch user data from your backend API + // Fetch user data from API gateway const fetchUser = async () => { // axios is directly used from Axios library to avoid interceptor // added in services/api.js @@ -32,7 +32,7 @@ export function AuthProvider({ children }) { const login = () => { // Start single sign-on process (Using OAuth2, OpenID) // Access /ui of API gateway. - // API gateway will redirect user to authorization server if the user is not logged in + // API gateway will redirect user to authorization server if the user is not logged in. // If logged in, API gateway will redirect browser to React app itself reloading the app. window.location.href = "/bff/ui"; } @@ -46,6 +46,7 @@ export function AuthProvider({ children }) { withCredentials: true }); // Redirect browser to logout from authorization server. + // This makes sure user is logged out from both the API gateway and OAuth2 authorization server. window.location.href = response.headers.location; // setUser(null) is not needed since browser is redirected. } catch (error) { @@ -81,7 +82,7 @@ export function AuthProvider({ children }) { return false; } - // Provide the state and the modifier function as a value object + // Add the user data and some functions to the AuthContext return ( <AuthContext value={{ user, login, logout, isLoggedIn, isAdmin, isInRole, isInRoles }}> {children} |