Feat/NaverLogin #7 네이버로그인 변경된 URI적용

Author: AngelaChaejung

src/components/login/NaverLogin.jsx

@@ -4,10 +4,10 @@ import NaverUnion from "../../img/NaverUnion.png";
 const NaverLogin = () => {
   const naverRef = useRef();
   const { naver } = window;
-  //    깃헙에 올릴 땐 아래의 env활용
+
   const NAVER_CLIENT_ID = "T9R5hFNUTuTa1UqoVBcO";
   // process.env.REACT_APP_NAVER_CLIENT_ID;
-  const NAVER_CALLBACK_URL = "http://localhost:3000/callback";
+  const NAVER_CALLBACK_URL = "http://localhost:3000/social/naver-login";
   // process.env.REACT_APP_NAVER_CALLBACK_URL;
   const initializeNaverLogin = () => {
     const naverLogin = new naver.LoginWithNaverId({

src/components/login/NaverLoginLoding.jsx

@@ -9,17 +9,17 @@ function NaverLoginLoding() {
   const getToken = async () => {
     const navertoken = window.location.href.split("=")[1].split("&")[0];
     console.log(navertoken);
-    // URL에서 추출한 access token을 로컬 스토리지에 저장
 
     // sessionStorage.setItem("NaverAuthorization", navertoken);
   };
 
   const sendTokenAndGetAuthorization = async () => {
     await axios
-      .post("https://eb.jxxhxxx.shop/naver/login", {
-        // .post("http://hayangaeul.shop/naver/login", {
-        token: window.location.href.split("=")[1].split("&")[0],
-      })
+      .post(
+        "https://eb.jxxhxxx.shop/social/naver-login",
+
+        { token: window.location.href.split("=")[1].split("&")[0] }
+      )
 
       .then((res) => {
         //이미 멤버라면 Authorization이 담겨 올 것이고, member라고
@@ -33,10 +33,11 @@ function NaverLoginLoding() {
           const userId = res.data.data.userId;
           const profileImage = res.data.data.profileImage;
           console.log(nickname);
-          sessionStorage.setItem("token", accessToken);
+          sessionStorage.setItem("accessToken", accessToken);
           sessionStorage.setItem("nickname", nickname);
           sessionStorage.setItem("profileImage", profileImage);
           sessionStorage.setItem("userId", userId);
+          sessionStorage.setItem("email", email);
           alert("그님스에 오신걸 환영합니다");
           return window.location.assign("/main");
 

src/components/main/Main.jsx

@@ -10,31 +10,28 @@ import { __getSchedule } from "../../redux/modules/ScheduleSlice";
 const Main = () => {
   const navigate = useNavigate();
   const [profileImg, setProfileImg] = useState(defaultprofileImg);
-  const [nickName, setNickname] = useState("");
+  const [nickName, setNickname] = useState(sessionStorage.getItem("nickname"));
   const [email, setEmail] = useState("");
   const dispatch = useDispatch();
   const { schedules } = useSelector((state) => state.ScheduleSlice);
   const { isLoding } = useSelector((state) => state.ScheduleSlice);
   console.log(schedules);
 
   useEffect(() => {
-    const userId = window.sessionStorage.getItem("userId");
-    const getnickName = window.sessionStorage.getItem("nickname");
-    const getprofilImg = window.sessionStorage.getItem("profileImage");
-    const getEmail = window.sessionStorage.getItem("email");
-    if (getnickName && getEmail) {
-      setNickname(() => getnickName);
-      setEmail(() => getEmail);
+    const getNickname = sessionStorage.getItem("nickname");
+    const getemail = sessionStorage.getItem("email");
+    const getprofilImg = sessionStorage.getItem("profileImage");
+    const userId = sessionStorage.getItem("userId");
+
+    if (getNickname && getemail) {
       if (getprofilImg) {
         setProfileImg(getprofilImg);
       }
-      dispatch(__getSchedule(userId));
     } else {
       navigate(`/login`);
     }
-  }, [navigate, dispatch]);
-  sessionStorage.removeItem("selectedJoiner");
-  sessionStorage.removeItem("selectedJoinerNames");
+    dispatch(__getSchedule(userId));
+  }, [navigate, nickName, dispatch]);
 
   return (
     <>

src/shared/Router.jsx

@@ -57,7 +57,7 @@ const Router = () => {
           <Route path="/kakaoLogin" element={<KakaoLogin />} />
           <Route path="auth/kakao/callback" element={<KakaoLoginLoding />} />
           <Route path="/naver/login" element={<NaverLoginPage />} />
-          <Route path="/auth/naver/callback" element={<NaverLoginLoding />} />
+          <Route path="/social/naver-login" element={<NaverLoginLoding />} />
 
           {/* 마이페이지 */}
           <Route path="/profile" element={<Profile />} />