Skip to main content

React

The React code of our domain.com/callback page

import React, { useEffect, useState } from "react";
import axios from "axios";
const CONFIG = {
 API_URL: "https://xxx.api.com",
 CALLBACK_URL:
   "https://localhost:3000/callback",
};
 
const CallbackMidentity = () => {
 
 const queryString = new URLSearchParams(window.location.href);
 const [code, setCode] = useState(queryString.get("code"));
 const [userMidentity, setUserMidentity] = useState(null);
 const [loading, setLoading] = useState(false);
 
 useEffect(() => {
   const authorize = () => {
     if (!code) {
       setLoading(true);
       axios
         .get(
           CONFIG.API_URL +
             "/auth/oidc?redirect_uri=" +
             CONFIG.CALLBACK_URL
         )
         .then((response) => {
           window.location.href = response.data.composed_url;
         })
         .catch((error) => {});
     } else {
       if (!userMidentity) {
         axios
           .post(CONFIG.API_URL + "/auth/code", {
             code: code,
             redirect_uri: CONFIG.CALLBACK_URL,
           })
           .then((response) => {
             setUserMidentity(response.data.user);
           })
           .catch((error) => {})
           .finally(setLoading(false));
       } else {
         return;
       }
     }
   };
   authorize();
 }, [code]);
 
 return (
   <div>
     {loading ? (
       <h1>loading</h1>
     ) : (
       <h1>{userMidentity && userMidentity.email}</h1>
     )}
   </div>
 );
};
 
export default CallbackMidentity;
info