멋쟁이 사자처럼 at 한국교통대학교 7기

2019 KNUT X LIKE LION #7

코스 전체목록

닫기

사용자 관리 - 로그인

사용자 관리 - 로그인

 

 

  • 우리는 따로 카카오톡 로그인 버튼을 만들지는 않습니다.
    [제출]버튼을 누르면 연결되도록 만들 것입니다.
     
  • 해당 로그인 기능은 OAuth 2.0을 지원합니다.
    OAuth에 대해서는 설명하지 않도록 하겠습니다.
    다른 사이트에서 해당 사이트와 상관없는 카카오 로그인, 페이스북 로그인, 구글 로그인 등을 본 적이 있을 겁니다.
    이러한 제 3자의 인증을 가능하게 하도록 하는 표준이라고 생각하시면 됩니다.

    참고)
    OAuth란? https://ko.wikipedia.org/wiki/OAuth
    생활코딩 - OAuth 2.0 : https://www.opentutorials.org/course/3405

 

 

 

 

  • [Request]는 우리가 서버로 자원을 요청하는 방식에 대해 나타낸 것입니다.
     
  • 'POST', 'GET', 'PUT', 'DELETE' 등 - 자원을 어떻게 요청할 지를 나타내는데 여기서 'GET' 방식으로 요청하라고 말하는 것입니다.
     
  • 'Host'는 서버의 호스트 주소가 'kauth.kakao.com'이라는 이야기입니다.
  • 'client_id'는 우리가 발급받은 REST API 키 값을 대입하라고 나와있습니다.
  • 'redirect_url'은 플랫폼 설정해줄 때 보았던 주소입니다.
  • 'response_type'은 'code'로 고정하라고 하였습니다.
  • 나머지 키 값들은 필수 요소는 아니니 일단 스킵합니다.

 

 

 

 

 

views.py 수정

  • 위의 정보를 토대로 실질적으로 코드를 짜봅시다.
  • [blogapp]-[views.py]에서 oauth 함수를 만듭니다.


     
  • oauth 함수를 왜 만들까요?

  • 우리가 어떤 식으로 카카오에 요청을 했다고 칩시다.
    그러면 그 응답[Response]을 'redirect_uri'로 보낸다고 적혀있습니다.
    즉, 우리가 플랫폼 설정할 때 적어주었던 주소인 'http://127.0.0.1:8000/oauth'로 응답을 한다는 것입니다.
  • 이에 대한 답을 받기 위해서 뷰와 url을 추가하도록 하겠습니다.
def oauth(request):
    return redirect('blogMain')

 

  • 일단 당장은 어떤 처리를 할지 정해지지 않았으므로 단순히 호출이 되면 블로그 메인 페이지로 가도록 설정하였습니다.

 

 

 

 

 

urls.py 수정

  • 위에서 얘기한 대로 url을 추가합니다.
path('oauth/', blogapp.views.oauth, name='oauth'),

 

 

 

 

 

 

views.py 수정

  • detail 함수를 수정하도록 합니다.

 

  • uri로의 요청은 다음과 같이 합니다.

  • Host와 위의 문서에서 요구하는 대로 작성하면 됩니다.
    다음 uri로 요청을 해보겠습니다.
  • https://kauth.kakao.com/oauth/authorize?client_id=187fc792a19f9586952c9a8527459053&redirect_uri=http://127.0.0.1:8000/oauth&response_type=code&scope=talk_message
  • 현재 작성된 detail 함수입니다. 
login_request_uri = 'https://kauth.kakao.com/oauth/authorize?'

client_id = '187fc792a19f9586952c9a8527459053'
redirect_uri = 'http://127.0.0.1:8000/oauth'

login_request_uri += 'client_id=' + client_id
login_request_uri += '&redirect_uri=' + redirect_uri
login_request_uri += '&response_type=code'

 

 

 

 

Response

  • 위에서는 요청(Request)을 하였다면 그 요청에 대한 응답(Response)를 받아야 합니다.

 

  • 'redirect_uri' 주소로 'code' 값을 얻어오라고 써있습니다.
  • 따라서 우리는 oauth 함수를 수정해야합니다.
  • 요청할 때에 GET 방식으로 요청하였으므로 GET 방식으로 'code' 값을 받아올 수 있도록 수정합니다.

 

 

 

적용 확인

  • 서버를 구동하고, 정상적으로 실행되는지 확인합니다.
  • 댓글을 입력하고, 제출버튼을 누릅니다.

 

  • 카카오톡 로그인 화면이 나타납니다.
  • 로그인해봅시다.

 

  • 이전에 입력하였던 앱 이름과 정보 수집 제공을 위한 동의를 물어봅니다.
  • 우리는 닉네임과 프로필 사진만 설정하였으므로 다음 내용만 나타납니다.
  • 동의하고 넘어갑니다.

 

  • 동의 버튼을 누르면 블로그 메인 화면이 나타납니다.

 

  • 콘솔 창에는 다음과 같이 'code' 값을 불러온 것을 확인할 수 있습니다.

 

 

 

 

댓글

댓글 본문
  1. 이민휘
    error="invalid_grant", error_description="Invalid redirect: http://127.0.0.1......uth does not match one of the registered values. Please check app settings on kakao developer site."
    뭐가 잘못 되었다는 말인가요?
    당연히 code를 받지 못하네요.
  2. 이민휘
    콘솔에는 이상이 없이 잘 띕니다.
    메일 이 바뀌어서 crebizias@naver.com으로 부탁 드립니다
  3. 이민휘
    지금까지 잘 따라 왔는데...
    client_id = REST API키를 넣었고
    redirect_uri = 'http://localhost:8000/oauth'
    카톡 로그인 화면이 안 나타납니다.
    왜 안될까요?
  4. Vanillatic
    '&redirect_uri='인데...
    '&redirect_uri' 써놓구 한참을 삽질ㅠㅠ
  5. Guraeng
    client_id만 자신의 REST API 키로 바꿔주시면 잘 작동합니다.
    대화보기
    • 세계최고마케터
      엿 여기서 에러가 발생하네요~~

      NoReverseMatch at /blogMain/detail/1/
      Reverse for 'login_request_uri' not found. 'login_request_uri' is not a valid view function or pattern name.

      이런 에러가 발생하였는데요~

      https://kauth.kakao.com......age
      이걸 각자 바꿔야겠죠?
    버전 관리
    KNUT X LIKE LION
    현재 버전
    선택 버전
    graphittie 자세히 보기