ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • Flask 로그인에서 Session 활용하기
    웹프로그래밍/Flask(Python) 2021. 4. 14. 14:24
    반응형

    이전 시간에 우리는 Flask를 통해 간단한 로그인을 구현해 보았다.

     

    2021.04.13 - [웹프로그래밍/Flask(Python)] - Flask로 로그인 구현하기(No Database)

     

    Flask로 로그인 구현하기(No Database)

    저번 시간에 우리는 Flask로 간단한 웹 사이트를 구축 해보았다. 2021.04.12 - [웹프로그래밍/Flask(Python)] - Introduction of Flask & Develop Web Application Introduction of Flask & Develop Web Applicati..

    insbox.tistory.com

     

    Session은 서버에서 보관하고 있는 하나의 오브젝트로, 주로 로그인 정보를 유지하기 위해 사용된다.

    오랫동안 사이트에서 아무 활동을 하지 않았을 때, 새로고침을 하면 첫 화면으로 돌아가면서 로그아웃 된 모습을 본 적이 있을 텐데, 이것이 바로 보안상 Session을 자동적으로 끊어서 발생하는 경우다.

     

    만약 session을 활용하지 않으면 어떤 문제점이 발생할 수 있을까?

    1. 관리자만 접속 가능한 공간에 접속 할 수가 있다 ( Authentication Problem )

    2. 페이지를 이동할 때 마다, 매번 사용자의 정보를 넘겨야 한다. ( Data Management Problem )

     

    이런 여러가지 문제점 때문에, Session 사용은 필수다.

     

    이번 시간에는 로그인 과정을 수정하여 Session 정보를 홈페이지에 출력하도록 해보자.

    또한, 제한된 아이디만 접근이 가능한 페이지를 만들어 보고, 각 페이지에서 로그아웃을 할 수 있도록 하자.

     


    먼저 로그인 과정에서 아이디를 세션에 저장해보자.

     

    1. login_confirm

    @app.route('/login_confirm', methods=['POST'])
    def login_confirm():
        id_ = request.form['id_']
        pw_ = request.form['pw_']
        if (id_ == 'admin' and pw_ == 'admin') or (id_ == 'user' and pw_ == 'user'):
            session['id'] = id_
            return redirect(url_for('index'))
        else:
            return redirect(url_for('login'))
    

    session['id'] = id_

    쉽게 생각해서 session 오브젝트의 'id'라는 변수를 생성하고, 값을 id_로 초기화 하는 과정이다.

     

    나중에 관리자만 접속 가능한 페이지를 만들 예정이기 때문에, 관리자가 아닌 user 계정도 로그인이 가능하게 만들었다.

     

    이제 index 페이지에서 로그인 한사람이 누구인지 보여주도록 하자.

     

     

    2. index.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Index</title>
        <script  src="http://code.jquery.com/jquery-latest.min.js?ver=1.1"></script>
        <script>
            $(document).ready(function(){
                if ("{{session['id']}}" == ""){
                    alert("올바른 경로가 아닙니다!!");
                    location.href = "/login";
                }
            });
        </script>
    </head>
    <body>
        <h4>{{session['id']}}님 반갑습니다. 여기는 Index 페이지 입니다.</h4>
        <br>
        <a href="/admin">관리자 페이지로 이동</a><br>
        <a href="/logout">로그아웃</a>
    </body>
    </html>

    Flask는 Jinja2라는 매력적인 엔진을 가지고 있다.

    정확하게 말하자면, Jinja2는 Python 프로그래밍 언어를위한 웹 템플릿 엔진으로 플라스크의 개발자 Armin Ronacher에 의해 개발되었다. 즉 이게 무슨 말이냐, 템플릿에서도 파이썬의 기능을 구현할 수 있다는 것이다.

     

    더보기

    Jinja2는 크게 변수, 동작으로 구분되어 있다.

    템플릿에서 파이썬 변수를 표현하기 위해, {{ 변수명 }} 으로 작성하면, 변수의 값을 불러올 수 있고

    파이썬 동작을 하기 위해, {% 동작 %} 으로 작성하면, 파이썬 동작을 수행 가능하다.

     

    Jinja2 문법은 관리자 페이지에서 사용자 목록을 불러오는 기능을 구현할 때, 조금 더 상세하게 다루도록 하겠다.

     

    이렇게 Jinja2를 사용하면 파이썬 메모리에 있는 세션값을 불러오는 것이 가능하게 된다.

     

    jquery를 이용한 스크립트의 조건문을 보면 그 내용은 다음과 같다.

    "사용자가 올바르게 로그인한 상태가 아니라면, 접근할 수 없다"

     

    만약, 스크립트의 조건문을 만족하지 않는다면, 올바르게 페이지를 보여준다.

     

    이제 관리자만 접근 가능한 페이지를 만들어 보도록 하자.

    3. admin

    @app.route('/admin')
    def admin():
        return render_template('admin.html')

     

     

    4. admin.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Admin</title>
        <script  src="http://code.jquery.com/jquery-latest.min.js?ver=1.1"></script>
        <script>
            $(document).ready(function(){
                if ("{{session['id']}}" != "admin"){
                    alert("관리자 아이디가 아닙니다!!");
                    location.href = "/index";
                }
            });
        </script>
    </head>
    <body>
        <h4>여기는 관리자 페이지 입니다.</h4>
        <br>
        <a href="/index">Index 페이지로 이동</a>
        <a href="/logout">로그아웃</a>
    </body>
    </html>

    jquery를 이용한 스크립트의 조건문을 보면 그 내용은 다음과 같다.

    "사용자가 로그인한 계정이 admin이 아니라면, 접근할 수 없다"

     

    이제 로그아웃을 할 수 있는 기능을 추가하자

     

    5. logout

    @app.route('/logout')
    def logout():
        session.clear()
        return redirect(url_for('login'))

    session.clear()

    session에 할당된 모든 것을 지우는 동작이다.


    실행 화면

    로그인 화면
    admin으로 로그인한 메인 화면
    admin으로 관리자 페이지에 접근 할 때
    로그아웃 후, user로 로그인한 메인 화면
    user로 관리자 페이지에 접근 할 때

     

    이로서 우리는 모든 페이지를 구현했다.

     

    다음 시간에는 database(mysql)를 활용한 회원가입과 로그인을 나누어서 구현 해보도록 하자.

     

    [github.com/jaeseok3] 소스코드는 제 깃허브에서 가져가시면 됩니다.

    댓글

Designed by Tistory.