ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [Django] Django 연습장 - 4. 로그인 기능 만들기
    프로그래밍/Django 2022. 4. 15. 02:42
    반응형

    이번 시간에는 로그인 기능을 만들어 보겠습니다.

     

    로그인에도 다양한 방식이 있지만 가장 간단하게 django에서 제공하는 login 방식을 사용해보겠습니다.

    해당 방식은 session방식으로 jwt방식과는 다릅니다.

    차이점은 추후 기회가 되면 설명하겠습니다.

     

    [작업 리스트]

    - 로그인용 페이지 만들기

    - 로그인 기능 만들기

     

    app_accounts에서 작업합니다.

     

    1. 로그인용 페이지 만들기.

    html은 일단 귀찮아서 꾸미지 않는 것으로.. 다음시간에 템플릿을 한 번 찾아보겠습니다.

    일단 input받을 수 있는 간단한 html만 만들었습니다.

    app_accounts > templates > login.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <div class="section">
            <form method="POST" action="{% url 'login' %}">
                {% csrf_token %}
                <div class="login_box" style="_display: none">
                    <div class="login_box_title">로그인</div>
    
                    <div class="">
                        <div class="">
                            <div class="">이메일</div>
                            {%  if form.email.errors %}
                            <div class="">{{form.email}}</div>
                            <div class="">
                                <div class="">
                                    <span class="">{{form.username.errors}}</span><br>
                                </div>
                            </div>
                            {% else %}
                            <div class="">
                                {{form.email}}
                            </div>
                            {%  endif %}
                        </div>
                        <div>
                            <div class="">비밀번호</div>
                            {%  if form.password.errors %}
                            <div class="">{{form.password}}</div>
                            <div class="">
                                <div class="">
                                    <span class="">{{form.password.errors}}</span><br>
                                </div>
                            </div>
                            {% else %}
                            <div class="">
                                {{form.password}}
                            </div>
                            {%  endif %}
                        </div>
                    </div>
                    <div class="">
                        <button type="submit" id="loginButton" class="">로그인</button>
                    </div>
                </div>
            </form>
        </div>
    </body>
    </html>

    이제 이것을 띄우고 데이터를 받을 view와 form을 만듭니다.

    app_accounts views.py & forms.py

    class LoginForm(forms.Form):
    
        email = forms.CharField(
            error_messages={'required': '이메일을 입력해주세요'},
            max_length=128,
            label='이메일',
            widget=forms.EmailInput(attrs={'placeholder': '이메일을 입력해주세요', 'data-width': '100%'})
        )
        password = forms.CharField(
            error_messages={'required': "비밀번호를 입력해주세요"},
            widget=forms.PasswordInput(attrs={'placeholder': '비밀번호를 입력해주세요', 'data-width': '100%'}),
            label="비밀번호",
        )
    class LoginPage(FormView):
        # 로그인 페이지 View
        template_name = 'login.html'
        form_class = LoginForm
        success_url = reverse_lazy('accounts_main')

     

    app_accounts urls.py

    url추가!

    path('signin', LoginPage.as_view(), name='signin_page'),

    하고 해당 페이지에 들어가면 단촐한 로그인 페이지가 나옵니다.

     

    해당 페이지에 회원가입때 만든 기능으로 만든 email과 password를 입력하면 되는데 아직은 로그인을 시키는(인증하는) 기능을 안 만들었기 때문에 이어서 로그인 기능을 만들겠습니다.!

    현재는 페이지만 만든 것입니다.

     

    2. 로그인 기능 만들기.

    로그인 기능은 다음과 같은 코드를 app_accounts > views.py에 추가하면 됩니다.

    from django.shortcuts import render, redirect, HttpResponse, get_object_or_404
    from django.http import JsonResponse
    from django.views.generic.edit import FormView,View
    from django.views.generic import CreateView
    from django.contrib.auth import authenticate, login, logout
    from django.urls import reverse_lazy
    #로그인 시도
    class LoginView(View):
    
        def post(self, request):
            email = request.POST.get('email', None)
            password = request.POST.get('password',None)
            #인증증
            user = authenticate(request, email=email, password=password)
            #정보 불일치
            if user is None:
                pass
            #로그인
            login(request, user)
            return JsonResponse({'msg':'success signin'}, status=200)

    코드를 보시면 이전과는 다르게 View를 상속받아서 post함수에 작성을 했는데요.

    로그인을 form으로 전송할 것이고 post방식으로 전송할 것이기 때문에 해당 함수에 작성하였습니다.

    post 요청을하면 post함수가 작동합니다.

     

    해당 기능은 email과 password를 받고 해당 값들이 있는지 확인 > login함수를 사용해서 session_id를 만들어 냅니다.

    urls.py에 해당 코드까지 넣으면 로그인 기능 구현이 끝납니다.

    path('login', LoginView.as_view(), name='login'),
    

    이렇게 한 뒤 html을 다시보면

    <form method="POST" action="{% url 'login' %}">
    
    ....
    
                        <button type="submit" id="loginButton" class="">로그인</button>
    
    </form>

    다음과 같이 form태그에 method와 action시킬 url을 지정했고, button type에 submit을 작성해놨습니다.

    이렇게 작성된 html에 email과 password를 입력하고 버튼을 누르면 해당 내용이 POST방식으로 'login'이라고 달아놓은 url -> 즉 /accounts/login에 요청되고 LoginView가 작동합니다. loginview가 작동하면 ..

     

    개발자 도구로 들어가 로그인이 성공한 것을 알 수 있는데 쿠키에 sessionid가 생겼습니다.

    해당 정보를 가지고 django에서 로그인 된 사용자만 다른 페이지들을 볼 수 있게 지정 할 수 있습니다!.

     

    로그인 기능은 여기까지였고 다음 시간에는 무료 템플릿을 가져와서... 좀 입혀보겠습니다.

    반응형
Designed by Tistory.