본문 바로가기
Personal Project

django에서 kakao 로그인 api 사용하기 +(allauth 사용)

by applepick 2020. 8. 19.
반응형

일단 어느 정도 구현했으니 카카오 로그인 기능도 추가하고 싶었습니다.

완성된 페이지를 보여드리겠습니다.

 

 

이런 식으로 구현했습니다. 

pip install django-allauth

 일단 allauth를 깔아줍시다. 

INSTALLED_APPS = [
	...
    'allauth',
    'allauth.account',
    'allauth.socialaccount',
    # ... include the providers you want to enable:
    'allauth.socialaccount.providers.auth0',
    'allauth.socialaccount.providers.kakao',
    ...
]

LOGIN_REDIRECT_URL = 'home' # 로그인 후 리디렉션할 페이지
ACCOUNT_LOGOUT_REDIRECT_URL = "home"  # 로그아웃 후 리디렉션 할 페이지
ACCOUNT_LOGOUT_ON_GET = True # 로그아웃 버튼 클릭 시 자동 로그아웃

SITE_ID = 1

allauth을 사용하기 위해서는 settings.py에서 사용할 것을 선언해줍니다. kakao를 사용할 것이기 때문에 카카오만 추가해줬습니다.

그리고 이제 로그인 후와 로그 인전의 페이지를 보여주기 위해 저렇게 선언해주었습니다.

SITE_ID =1을 쓴 이유는 오류 페이지를 뱉어낼 때 받아주기 위해서입니다. 안 써도 되지만 오류를 줄이기 위해...

urlpatterns = [
    path('account/', include('allauth.urls')),
]

urls.py를 설정해줍니다.

그리고 DB에 migrate 적용시켜줍니다. 

python manage.py migrate

또 views.py에서 카카로 로그인 뷰를 생성해줘야겠죠?

def kakao_login(request):
    app_rest_api_key = os.environ.get("KAKAO_REST_API_KEY")
    redirect_uri = main_domain + "users/login/kakao/callback"
    return redirect(
        f"https://kauth.kakao.com/oauth/authorize?client_id={'api 키 값'}&redirect_uri={'넘겨주는 url값'}&response_type=code"
    )

괄호 안에 있는 것은 키값이랑 넘겨 받는 페이지 즉, url을 써주시면 됩니다.

 

이제 runserver를 돌려 admin 페이지에 들어가면

 

 

이런 식으로 소셜 계정란이 생겼습니다.

여기서 소셜 애플리케이션으로 들어갑시다.

 

 

소셜 애플리케이션 추가를 누르시면 이런 페이지가 나옵니다.

아까 세팅에서 kakao를 추가했으니 제공자에 kakao가 표시될 것입니다.

클라이언트 아이디는 

https://developers.kakao.com/

 

Kakao Developers

카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인, 메시지 보내기, 친구 API, 인공지능 API 등을 제공합니다.

developers.kakao.com

여기로 들어가셔서 앱을 설정하시고 웹으로 사용한다 하면 웹에 체크하시고

ID에 REST API 키를 넣으시고 카카오톡 소셜 로그인의 시크릿 키는 없습니다. 그래서 none이라도 아무거나 알아볼 수 있도록 설정해줍니다.

 

그리고 사이트를 보면 example.com으로 되어 있는데 장고 어드민으로 가면 사이트를 추가할 수 있는 항목이 있습니다.

저는 localhost:8000로 추가했습니다. 배포 전 해당하는 URL을 전부 추가하세요.

또한 콜백을 사용하기 위해서

http://localhost:8000/accounts/kakao/login/callback/

이것도 추가해주시면 됩니다.

 

그러면 카카오 로그인 api로 로그인할 수 있게 됩니다!

 

반응형

댓글