[Feat]라이브러리를 활용한 구글 로그인

구글 로그인창으로 이동후 로그인 credentialResponse를 응답 백엔드로 전송후 디코딩, ID를 인증 후 엑세스 토큰과 리프레시 토큰을 프론트엔드로 전달 프론트엔드에서 토큰들을 로컬 스토리지에 저장 Issues #100
codestates-seb · Sep 13, 2023 · 62599d2 · 62599d2
1 parent b09a7e2
commit 62599d2
Showing 1 changed file with 3 additions and 3 deletions.
diff --git a/client/src/components/Logins/OAuthLogin.tsx b/client/src/components/Logins/OAuthLogin.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 import styled from 'styled-components';
 import kakaoLogo from '../../asset/images/KakaoLogo.svg';  
 import axios from 'axios';
-// import { GoogleOAuthProvider, GoogleLogin, googleLogout } from '@react-oauth/google';
+import { GoogleOAuthProvider, GoogleLogin } from '@react-oauth/google';
 
 const OAuthLoginModal: React.FC<LoginModalProps> = ({ onClose, onEmailLoginClick, onEmailSignupClick }) => {
     const titleText = "로그인";
@@ -35,7 +35,7 @@ const OAuthLoginModal: React.FC<LoginModalProps> = ({ onClose, onEmailLoginClick
             <ModalContainer>
                 <CloseButton onClick={onClose}>&times;</CloseButton>
                 <Title>{titleText}</Title>
-                {/* <GoogleOAuthProvider clientId="<your_client_id>">
+                <GoogleOAuthProvider clientId="690344785644-2oj84rcukd2rhu3o56gbq6rahap16m37.apps.googleusercontent.com">
                     <GoogleLogin
                         onSuccess={credentialResponse => {
                             console.log(credentialResponse);
@@ -44,7 +44,7 @@ const OAuthLoginModal: React.FC<LoginModalProps> = ({ onClose, onEmailLoginClick
                             console.log('Login Failed');
                         }}
                     />;
-                </GoogleOAuthProvider>; */}
+                </GoogleOAuthProvider>;
                 <KakaoButton onClick={handleKakaoLogin}>
                     <LogoImage src={kakaoLogo} alt="Kakao Logo" />
                     {kakaoLoginText}