안 쓰던 블로그

[파이썬 Flask] 회원가입 웹 시스템 만들기 본문

언어/파이썬

[파이썬 Flask] 회원가입 웹 시스템 만들기

proqk 2020. 9. 3. 15:17
반응형

Flask 플라스크는 파이썬으로 웹 어플리케이션을 구현할 때 사용하는 프레임워크다

파이썬 웹 프로그래밍 프레임워크 중 잘 알려진 것이 django와 flask이다

쟝고는 여러 모듈과 기능을 제공하여 무거운 대신 다양한 것을 공부할 수 있는 반면, 플라스크는 상대적으로 가볍고 비교적 쉽게 배울 수 있다고 한다

 

준비

먼저 플라스크를 위해서 아래 패키지를 설치해 준다

pip install flask
pip install Flask-SQLAlchemy

flask는 말 그대로 플라스크고, sqlalchemy는 model부분을 도와주는 라이브러리이다

orm(object relational mapper)로서 파이썬 안에서 객체로 클래스나 함수로 사용할 수 있다

 

 

잘 설치되었는지 테스트한다

아래는 hello world를 출력하는 코드

from flask import Flask #설치한 Flask 패키지에서 Flask 모듈을 import 하여 사용
app = Flask(__name__)  #플라스크를 생성하고 app 변수에 flask 초기화 하여 실행

@app.route('/') #사용자에게 ( ) 에 있는 경로를 안내한다
def hello_world(): #누군가가 위의 주소에 접근하면 함수 실행
    return 'hello world!'
    
if __name__ == '__main__':
    app.debug = True
    app.run()

vscode환경 기준으로 그냥 F5실행이 아니라 python 명령어로 실행하여 http://127.0.0.1:5000/ 에 접속한다

hello world가 잘 뜨면 성공이다

 

 

회원가입 만들기

Flask-SQLAlchemy(foxtrotin.tistory.com/268)를 DB로 사용하여 회원가입 페이지를 만들어 보겠습니다

 

 

models.py

from flask_sqlalchemy import SQLAlchemy

db = SQLAlchemy() #SQLAlchemy를 사용해 데이터베이스 저장

class User(db.Model): #데이터 모델을 나타내는 객체 선언
    __tablename__ = 'user_table' #테이블 이름
    
    id = db.Column(db.Integer, primary_key=True)
    email = db.Column(db.String(32), unique=True, nullable=False)
    userid = db.Column(db.String(32), unique=True, nullable=False)
    password = db.Column(db.String(8), nullable=False)

    def __init__(self, email, password):
        self.email = email
        self.set_password(password)
    
    def set_password(self, password):
        self.password = generate_password_hash(password)
 
    def check_password(self, password):
        return check_password_hash(self.password, password)

먼저 데이터베이스로 사용할 파일을 만든다

email, userid, pw 칼럼을 만들었다

 

app.py

import os #디렉토리 절대 경로
from flask import Flask, render_template, request, redirect
from flask_sqlalchemy import SQLAlchemy
from Models import db
from Models import User
app = Flask(__name__)

@app.route('/')
def hello():
	return 'Hello World!'

@app.route('/register', methods=['GET','POST']) #GET(정보보기), POST(정보수정) 메서드 허용
def register():
    if request.method == 'GET':
        return render_template("register.html")
    else:
        userid = request.form.get('userid')
        email = request.form.get('email')
        password = request.form.get('password')
        password_2 = request.form.get('password')

        if not(userid and email and password and password_2):
            return "입력되지 않은 정보가 있습니다"
        elif password != password_2:
            return "비밀번호가 일치하지 않습니다"
        else:
            usertable=User() #user_table 클래스
            usertable.userid = userid
            usertable.email = email
            usertable.password = password
            
            db.session.add(usertable)
            db.session.commit()
            return "회원가입 성공"
        return redirect('/')

if __name__ == "__main__":
    #데이터베이스---------
    basedir = os.path.abspath(os.path.dirname(__file__)) #현재 파일이 있는 디렉토리 절대 경로
    dbfile = os.path.join(basedir, 'db.sqlite') #데이터베이스 파일을 만든다

    app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///' + dbfile
    app.config['SQLALCHEMY_COMMIT_ON_TEARDOWN'] = True #사용자에게 정보 전달완료하면 teadown. 그 때마다 커밋=DB반영
    app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False #추가 메모리를 사용하므로 꺼둔다

#    db = SQLAlchemy() #SQLAlchemy를 사용해 데이터베이스 저장
    db.init_app(app) #app설정값 초기화
    db.app = app #Models.py에서 db를 가져와서 db.app에 app을 명시적으로 넣는다
    db.create_all() #DB생성

    app.run(host="127.0.0.1", port=5000, debug=True)

http://127.0.0.1:5000/ 에 들어가면 Hello World! 가 뜬다

http://127.0.0.1:5000/register 에 들어가면 회원가입 화면이 뜬다

 

GET방식으로 /templates/register.html 파일을 가져와서 띄운다

아이디, 이메일 비번, 비번확인 칸을 입력 받는다

전부 입력되지 않았으면 에러 메시지, 비밀번호와 비밀번호 확인이 다르면 에러 메시지를 출력한다

전부 해당하지 않으면 DB에 정보를 넣는다

아까 만든 User클래스에 접근해서 각 칼럼에 데이터를 넣고 commit해 준다

커밋이 완료되면 회원가입 성공

 

메인 함수에 있는 부분은 주석을 달았다 foxtrotin.tistory.com/268 여기서도 자세한 내용을 확인할 수 있다

 

register.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset='utf-8' />
        <meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no' />
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
        <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
        <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
        <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
    </head>
<body>
    <div class = "container">
        <div class="row mt-5">
            <h1>회원가입</h1>
        </div>

        <div class="col-12">
            <br><br>
            <form method="POST" action=".">
                <div class="form-group">
                    <label for="userid">아이디</label>
                    <input type="text" class="form-control" id="userid" placeholder="아이디" name="userid"/>
                </div>
                <div class="form-group">
                    <label for="email">이메일</label>
                    <input type="email" class="form-control" id="email" placeholder="이메일" name="email"/>
                </div>
                <div class="form-group">
                    <label for="password">비밀번호</label>
                    <input type="password" class="form-control" id="password" placeholder="비밀번호" name="password"/>
                </div>
                <div class="form-group">
                    <label for="re_password">비밀번호 확인</label>
                    <input type="password" class="form-control" id="re_password" placeholder="비밀번호 확인" name="re_password"/>
                </div>
                <button type="submit" class="btn btn-primary">제출</button>
            </form>
        </div>
        </div>
</body>
</html>

 

부트스트랩으로 회원가입 폼을 만든다

 

이제 app.py를 실행하고 rehttp://127.0.0.1:5000/register 로 접속한다

폼을 채우고 제출하면 다시 / 페이지로 돌아간다

 

 

 

참고

infinitt.tistory.com/30

반응형
저작자표시 비영리

'언어 > 파이썬' 카테고리의 다른 글

[파이썬 Flask] 로그인, 로그아웃 만들기(session)  (0) 2020.09.06
[파이썬 Flask] 회원가입 웹 시스템 만들기_2 WTF 적용하기  (1) 2020.09.04
[Flask] Flask-SQLAlchemy  (0) 2020.09.03
[파이썬] beautifulsoup로 2020년 네이버 실시간 검색어 크롤링 하기  (0) 2020.09.01
파이썬-selenium으로 웹 매크로 만들기  (0) 2020.06.07
'언어/파이썬' Related Articles more
Comments