AWS(Flask + uwsgi + Nginx+Mysql) 회원가입과 로그인 기능 추가하기

이전글과 이어지는 내용이다.

2021/02/03 - [aws 서버구축] - AWS(Flask + uwsgi + Nginx)에 mysql 연동하기

저번 글에서 flask와 mysql을 연동했는데 이번글에서는 이를 이용하여 간단한 회원가입과 로그인 기능을 구현할것이다.

구조

여기서 index.html은 테스트를 위해 남겨놓은 html임으로 없어도 상관 없다.

1.[/flask/templates/login.html]

<!DOCTYPE html>
<html>
        <head>
                <meta charset="UTF-8">
                <title>Loign</title>
        </head>

        <body>
                <div class="login-page">
                        <form action="/register" method="POST">
                                <input type="text" placeholder="username" name="username">
                                <input type="password" placeholder="password" name="password">
                                <input type="text" placeholder="email address" name="email">
                                <button type="submit">Create</button>
                        </form>
                        <br>
                        <form action="/login" method="POST">
                                <input type="text" placeholder="username" name="username">
                                <input type="password" placeholder="password" name="password">
                                <button type="submit">Login</button>
                        </form>



                </div>
                <h5>check user_info:{{info}}</h5>
        </body>
</html>

코드를 설명하자면 회원가입으로는 username,password,email을 받으며 입력후 create 버튼을 누르면 그값이 주소/register로 전달되는 방식이다.

로그인 또한 값을 입력받으면 /login으로 값이 전달되며 내부 코드 실행후 값이 존제하면 {{info}} 자리에 유저 정보가 나타나게 한다.

또한 주의해야할점은 name으로 설정한 값을 정확히 기억해서 app_route.py에서 그대로 써줘야한다.

3.[flask/route/app_route.py]

from flask import Blueprint, render_template, request, redirect
import pymysql
from flask_sqlalchemy import SQLAlchemy

app_route = Blueprint('first_route',__name__)


db = pymysql.connect(host='aws_public_ip', port=3306, user='root', passwd='password',db='W2A', charset='utf8')
#host 변경 필요함
cursor = db.cursor()


@app_route.route('/', methods=['GET'])
def index():
    return render_template('login.html')


@app_route.route('/test')
def test():
    print("HI")
    result_="wpgur"
    return render_template('index.html',result=result_)


@app_route.route('/login', methods=['GET','POST'])
def login():
    if request.method == 'POST':
        login_info = request.form

        username = login_info['username']
        password = login_info['password']

        sql = "SELECT * FROM UserInfo WHERE username=%s"
        rows_count = cursor.execute(sql, username)

        if rows_count >0:
            user_info =cursor.fetchone()
            print("user info: ", user_info)

            is_pw_correct = user_info[2]
            print("password check: ", is_pw_correct)

            return render_template('login.html',info=user_info)

        else:
            print('user does not exist')
            return render_template('login.html',info='user does not exist')

        #return redirect(request.url)

    return render_template('login.html')


@app_route.route('/register', methods=['GET','POST'])
def register():
    if request.method == 'POST':
        register_info = request.form

        username = register_info['username']
        password = register_info['password']
        email = register_info['email']
        sql = """
            INSERT INTO UserInfo (username, hashed_password, email)
            VALUES (%s, %s, %s);
        """
        cursor.execute(sql,(username, password, email))
        db.commit()


        print(username, password, email)

        #return redirect(request.url)
        return render_template('login.html')

    return render_template('login.html')

DB 연동 및 시작 페이지 설정

db = pymysql.connect(host='aws_public_ip', port=3306, user='root', passwd='password',db='W2A', charset='utf8')
#host 변경 필요함
cursor = db.cursor()


@app_route.route('/', methods=['GET'])
def index():
    return render_template('login.html')

먼저 db를 연결한뒤 /처음 들어갔을때의 페이지를 login.html로 설정해준다.

회원가입

password는 암호화를 통해 저장하는것이 보안상 맞지만 기능만을 구현하기위해 암호화 과정은 생략했다.

@app_route.route('/register', methods=['GET','POST'])
def register():
    if request.method == 'POST':
        register_info = request.form

        username = register_info['username']
        password = register_info['password']
        email = register_info['email']
        sql = """
            INSERT INTO UserInfo (username, hashed_password, email)
            VALUES (%s, %s, %s);
        """
        cursor.execute(sql,(username, password, email))
        db.commit()
        

        print(username, password, email)

        #return redirect(request.url)
        return render_template('login.html')

    return render_template('login.html')

세세하게 나눠서 설명을 하자면

@app_route.route('/register', methods=['GET','POST'])

/register가 호출되면 api가 실행되는데 메소드로 get,post 둘다해줘야 method 오류가 나지 않는다.

if request.method == 'POST':

이를 통해 값이 들어 왔는지 안들어왔는지를 판단한다.

register_info = request.form
username = register_info['username']
password = register_info['password']
email = register_info['email']

먼저 request 모듈을 통해 post 전달된 값(username,password,email)을 각 변수에 저장한다.

sql = """
            INSERT INTO UserInfo (username, hashed_password, email)
            VALUES (%s, %s, %s);
        """
cursor.execute(sql,(username, password, email))
db.commit()

sql 쿼리문을 작성한뒤 cursor.execute로 변수값을 튜플 형태로 넣어준뒤 실행시키고 db.commit 함수로 변화를 적용한다.

@app_route.route('/login', methods=['GET','POST'])
def login():
    if request.method == 'POST':
        login_info = request.form

        username = login_info['username']
        password = login_info['password']

        sql = "SELECT * FROM UserInfo WHERE username=%s"
        rows_count = cursor.execute(sql, username)

        if rows_count >0:
            user_info =cursor.fetchone()
            print("user info: ", user_info)

            is_pw_correct = user_info[2]
            print("password check: ", is_pw_correct)

            return render_template('login.html',info=user_info)

        else:
            print('user does not exist')
            return render_template('login.html',info='user does not exist')

        #return redirect(request.url)

    return render_template('login.html')

로그인 코드도 하나씩 설명하겠다.

@app_route.route('/login', methods=['GET','POST'])

/login의 메소드를 설정해준다.

login_info = request.form

username = login_info['username']
password = login_info['password']

request를 통해 들어온 데이터들(username,password)을 변수로 저장한다

sql = "SELECT * FROM UserInfo WHERE username=%s"
rows_count = cursor.execute(sql, username)

쿼리문을 작성해서 username이 존재하면 유저의 모든정보 들을 가져오게한다

쿼리문을 잘 모른다면 밑의 글을 읽고 오자
2021/01/01 - [웹 개념/database(mysql)] - DATABASE의 이해와 SQL 쿼리의 개념

+WHERE username=%s and password=%s를 하는것이 더 정확하지만 기능 구현만을 위해 간단하게 프로그래밍 했다.

if rows_count >0:
            user_info =cursor.fetchone()
            print("user info: ", user_info)

            is_pw_correct = user_info[2]
            print("password check: ", is_pw_correct)

            return render_template('login.html',info=user_info)

따라서 값을 제대로 가져왔으면 rows_count에 값이 있을 테니 info에 user_info를 저장해서 login.html로 넘겨주는데 이는 전에 설명했듯이 login.html코드 안에 {{info}} 자리에 나타난다.

else:
            print('user does not exist')
            return render_template('login.html',info='user does not exist')

마찬가지로 값이 없으면 user does not exist의 문구가 info가 되어 전달되게 한다.

표현 되는 모습

전체 코드:github.com/wpgur/AWS-Flask-uwsgi-Nginx-mysql

wpgur/AWS-Flask-uwsgi-Nginx-mysql

Contribute to wpgur/AWS-Flask-uwsgi-Nginx-mysql development by creating an account on GitHub.

github.com

참고:up-to-date-items.tistory.com/7

'aws 서버구축' 카테고리의 다른 글

Flask에 Css,Js,Images 적용 방법 (0)	2021.02.11
AWS(Flask + uwsgi + Nginx)에 mysql 연동하기 (0)	2021.02.03
docker-compose로 서버 구축하기(Flask + uwsgi + Nginx)(ubuntu) (0)	2021.01.24
AWS 구축 (0)	2021.01.23

wpgur-security