[Django] 회원가입 기능 만들기

목표

- auth를 이용해 회원가입 기능만들기

- 로그인, 로그아웃, 회원가입을 구현한다.

 

 

app 생성

$ python3 manage.py startapp account

 

터미널에서 회원가입, 로그인, 로그아웃의 기능을 구현할 별도의 app을 생성한다.

 

 

 

app을 생성했다면 settings.py에서 새로 생성한 app을 등록해준다.

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'blog.apps.BlogConfig',
    'account.apps.AccountConfig',
]

 

 

login.html, signup.html 생성

account 디렉토리 내에 templates 디렉토리를 만들고 각 로그인과 회원가입 화면(login.html, signup.html 파일)을 생성한다.

 

 

login.html

<form method="POST" action="{% url 'login' %}">
    {% csrf_token %}
    <p>username</p>
    <input type="text" name="username">
    <br>
    <p>password</p>
    <input type="text" name="password">
    <br>
    <input type="submit" value="로그인">
</form>

 

 

signup.html

<form method="POST" action="{% url 'signup' %}">
    {% csrf_token %}
    <p>username</p>
    <input type="text" name="username">
    <br>
    <p>password</p>
    <input type="text" name="password">
    <br>
    <p>confirm</p>
    <input type="text" name="confirm">
    <br>
    <input type="submit" value="회원가입">
</form>

 

 

views.py

account 앱 내 views.py에서 signup, login, logout을 처리할 메소드를 정의한다

from django.shortcuts import render, redirect
from django.contrib.auth.models import User
from django.contrib import auth
# Create your views here.

# 회원 가입
def signup(request):
    # signup 으로 POST 요청이 왔을 때, 새로운 유저를 만드는 절차를 밟는다.
    if request.method == 'POST':
        # password와 confirm에 입력된 값이 같다면
        if request.POST['password'] == request.POST['confirm']:
            # user 객체를 새로 생성
            user = User.objects.create_user(username=request.POST['username'], password=request.POST['password'])
            # 로그인 한다
            auth.login(request, user)
            return redirect('/')
    # signup으로 GET 요청이 왔을 때, 회원가입 화면을 띄워준다.
    return render(request, 'signup.html')

# 로그인
def login(request):
    # login으로 POST 요청이 들어왔을 때, 로그인 절차를 밟는다.
    if request.method == 'POST':
        # login.html에서 넘어온 username과 password를 각 변수에 저장한다.
        username = request.POST['username']
        password = request.POST['password']

        # 해당 username과 password와 일치하는 user 객체를 가져온다.
        user = auth.authenticate(request, username=username, password=password)
        
        # 해당 user 객체가 존재한다면
        if user is not None:
            # 로그인 한다
            auth.login(request, user)
            return redirect('/')
        # 존재하지 않는다면
        else:
            # 딕셔너리에 에러메세지를 전달하고 다시 login.html 화면으로 돌아간다.
            return render(request, 'login.html', {'error' : 'username or password is incorrect.'})
    # login으로 GET 요청이 들어왔을때, 로그인 화면을 띄워준다.
    else:
        return render(request, 'login.html')

# 로그 아웃
def logout(request):
    # logout으로 POST 요청이 들어왔을 때, 로그아웃 절차를 밟는다.
    if request.method == 'POST':
        auth.logout(request)
        return redirect('/')

    # logout으로 GET 요청이 들어왔을 때, 로그인 화면을 띄워준다.
    return render(request, 'login.html')

 

 

url

urls.py에 url path를 등록한다.

import account.views

urlpatterns = [
   	...
    
    path('login/', account.views.login, name='login'),
    path('signup/', account.views.signup, name='signup'),
    path('logout/', account.views.logout, name='logout'),
]

 

127.0.0.1:8000/signup/

 

127.0.0.1/login/

 

 

 

 

index.html

로그인과 회원가입, 로그아웃 기능 구현은 끝났다.

다른 화면에서 로그인 화면 또는 회원가입 화면으로 이동할 수 있는 버튼과 회원가입 버튼을 만들어주고,

로그인 상태에 따라 화면을 구성해보자

 

{% if user.is_authenticated %}
    <p>{{ user.username }}</p>
    <a href="javascript:{document.getElementById('logout').submit()}">로그아웃</a>
    <form id="logout" method="POST" action="{% url 'logout' %}">
        {% csrf_token %} <input type="hidden" />
    </form>
{% else %}
    <a href="{% url 'signup' %}">회원가입</a>
    <a href="{% url 'login' %}">로그인</a>
{% endif %}

 

메인화면(index.html) 상단에 위와 같은 코드를 추가해주었다.

템플릿 태그를 이용해 만약 사용자가 로그인 상태라면 '사용자이름'과 '로그아웃' 버튼을 보여주고,

사용자가 로그인 상태가 아니라면 '회원가입'과 '로그인'버튼을 보여주도록 한다.

 

로그인 되어있지 않은 상태

로그인 상태