개발_TIL | 2022-05-20(24)

▷ 머신러닝 프로젝트 시작(3)

< 소셜 로그인 구현(feat.Kakao) >

[https://developers.kakao.com/](https://developers.kakao.com/) 를 통하여 애플리케이션을 추가해주고

내가 사용할 REST API 키를 저장한 후

Redirect URI로 로그인 후에 이동할 홈페이지를 등록시켜 주었다.

그 후에 이제 VSCODE로 넘어와서 login.html에 a태그를 이용하여

<a href="https://kauth.kakao.com/oauth/authorize?client_id={REST API키 입력칸}&redirect_uri={Redirect URI입력칸}&response_type=code">카카오 로그인</a>

을 넣어주어 하이퍼링크를 걸었다.그 후 app.py로 넘어와서 코드를 입력 해주었다.

@app.route('/oauth')
def oauth():
    code = str(request.args.get('code'))
    # XXXXXXXXX 자리에 RESET API KEY값을 사용
    resToken = getAccessToken("XXXXXXXXX", str(code))

    return jsonify({'message': 'code=' + str(code) + '<br/>response for token=' + str(resToken)})


def getAccessToken(clientId, code):  # 세션 코드값 code 를 이용해서 ACESS TOKEN과 REFRESH TOKEN을 발급 받음
    url = "https://kauth.kakao.com/oauth/token"
    payload = "grant_type=authorization_code"
    payload += "&client_id=" + clientId
    payload += "&redirect_url=http%3A%2F%2Flocalhost%3A5005%2Foauth&code=" + code
    headers = {
        'Content-Type': "application/x-www-form-urlencoded",
        'Cache-Control': "no-cache",
    }
    reponse = requests.request("POST", url, data=payload, headers=headers)
    access_token = json.loads(((reponse.text).encode('utf-8')))
    return access_token

그 결과,

카카오 로그인 구현

일반적인 페이지 로그인창 밑 부분에 카카오 로그인 링크를 통해서 이동하게 되면

이와 같은 창으로 이동하면서 맨 처음에 만든 애플리케이션이 뜨면서 카카오 계정 로그인이 되어진다!

하지만 아직 미완성...

하지만, 카카오 로그인 자체는 구현이 되었지만 현재 개발중인 웹페이지와의 연동(?)에서 막혀버려서 원래대로라면

웹페이지와 연동이 되어 중간에 <로그인해주세요.> 가 아닌 이메일주소를 받아와야하며, 게시글 작성하러가기 버튼을 누르면 게시글 작성하는 창으로 이동을해야 되지만, 카카오계정으로 연결이 되어있지 않아 로그인을 하라고 뜨고있는 상황이다...이 난관을 해결하기 위해 카카오 API 레퍼런스를 뒤적이며 노력 중이다.