구글 로그인 (OAuth)

사전 작업

• 구글 클라우드 플랫폼 콘솔에서 oauth 동의 화면

  Google Cloud Platform
  

• 사용자 인증 정보에 리디렉션 url 추가

• client Id, client_secret 환경변수로 저장

OAuth 액세스 토큰 얻기

요청 URL

https://accounts.google.com/o/oauth2/auth?client_id={client_id}&redirect_uri={redirect_uri}&scope=email profile&response_type=code

요청하면 다음과 같은 화면이 뜨게 됩니다.

인증하면 리디렉션 헤더부분 파라미터에 code 가 발급됨

발급된 Code로 access_token 발급

요청 URL

https://oauth2.googleapis.com/token

body

| code | 발급받은 코드 |
| client_id | 클라이언트 ID |
| client_secret | 클라이언트 Secret ID |
| grant_type | authorization_code |
| redirect_uri | 설정한 리다이렉트 주소 |

작성 코드

		const code = req.query.code;

		// code로 access_token 발급
    var postVal = "grant_type=authorization_code" +
        "&code=" + code +
        "&client_id=" + secret_config.GOOGLE_CLIENT_ID +
        "&client_secret=" + secret_config.GOOGLE_CLIENT_SECRET +
        "&redirect_uri=" + secret_config.GOOGLE_REDIRECT_URL;

    axios({
        url: "https://oauth2.googleapis.com/token",
        headers: { 'content-type': 'application/x-www-form-urlencoded' },
        method: 'POST',
        data: postVal
    }).then(async function(response) {

        const access_token = response.data.access_token;

        console.log("received access_token : " + access_token);

    });

Access_token 으로 유저 정보 저장

요청 URL

https://www.googleapis.com/oauth2/v3/userinfo

body

			// access token으로 유저 정보 저장
       axios({
            url: 'https://www.googleapis.com/oauth2/v3/userinfo',
            headers: { 'content-type': 'application/x-www-form-urlencoded' },
            method: 'POST',
            data: 'access_token=' + access_token

        }).then(async function(response) {
            console.log("userId:" + response.data.sub);
            console.log("email:" + response.data.email);

            const userId = response.data.sub;
            const email = response.data.email;

참고 자료

OAuth 2.0 for Mobile & Desktop Apps | Google Identity | Google Developers

node.js 로 google oauth2 테스트 하기 rest api만 이용