커뮤니티
포인트
로딩중
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
웹개발 플러스 4주차 로그인페이지 기능 만들기
undefined주차
북마크
임*윤
댓글
1
추천
0
조회수
52
조회수
52
답변 완료
@app.route('/')
def home():
    token_receive = request.cookies.get('mytoken')
    try:
        payload = jwt.decode(token_receive, SECRET_KEY, algorithms=['HS256'])

        return render_template('index.html')
    except jwt.ExpiredSignatureError:
        return redirect(url_for("login", msg="로그인 시간이 만료되었습니다."))
    except jwt.exceptions.DecodeError:
        return redirect(url_for("login", msg="로그인 정보가 존재하지 않습니다."))


@app.route('/login')
def login():
    msg = request.args.get("msg")
    return render_template('login.html', msg=msg)


@app.route('/user/<username>')
def user(username):
    # 각 사용자의 프로필과 글을 모아볼 수 있는 공간
    token_receive = request.cookies.get('mytoken')
    try:
        payload = jwt.decode(token_receive, SECRET_KEY, algorithms=['HS256'])
        status = (username == payload["id"])  # 내 프로필이면 True, 다른 사람 프로필 페이지면 False

        user_info = db.users.find_one({"username": username}, {"_id": False})
        return render_template('user.html', user_info=user_info, status=status)
    except (jwt.ExpiredSignatureError, jwt.exceptions.DecodeError):
        return redirect(url_for("home"))


@app.route('/sign_in', methods=['POST'])
def sign_in():
    # 로그인
    username_receive = request.form['username_give']
    password_receive = request.form['password_give']

    pw_hash = hashlib.sha256(password_receive.encode('utf-8')).hexdigest()
    result = db.users.find_one({'username': username_receive, 'password': pw_hash})

    if result is not None:
        payload = {
            'id': username_receive,
            'exp': datetime.utcnow() + timedelta(seconds=60 * 60 * 24)  # 로그인 24시간 유지
        }
        token = jwt.encode(payload, SECRET_KEY, algorithm='HS256').decode('utf-8')

        return jsonify({'result': 'success', 'token': token})
    # 찾지 못하면
    else:
        return jsonify({'result': 'fail', 'msg': '아이디/비밀번호가 일치하지 않습니다.'})


@app.route('/sign_up/save', methods=['POST'])
def sign_up():
    username_receive = request.form['username_give']
    password_receive = request.form['password_give']
    password_hash = hashlib.sha256(password_receive.encode('utf-8')).hexdigest()
    doc = {
        "username": username_receive,  # 아이디
        "password": password_hash,  # 비밀번호
        "profile_name": username_receive,  # 프로필 이름 기본값은 아이디
        "profile_pic": "",  # 프로필 사진 파일 이름
        "profile_pic_real": "profile_pics/profile_placeholder.png",  # 프로필 사진 기본 이미지
        "profile_info": ""  # 프로필 한 마디
    }
    db.users.insert_one(doc)
    return jsonify({'result': 'success'})


@app.route('/sign_up/check_dup', methods=['POST'])
def check_dup():
    username_receive = request.form['username_give']
    exists = bool(db.users.find_one({"username": username_receive}))
    return jsonify({'result': 'success', 'exists': exists})


<script>
    // {% if msg %}
    //     alert("{{ msg }}")
    // {% endif %}
    function sign_in() {
        let username = $("#input-username").val()
        let password = $("#input-password").val()

        if (username == "") {
            $("#help-id-login").text("아이디를 입력해주세요.")
            $("#input-username").focus()
            return;
        } else {
            $("#help-id-login").text("")
        }

        if (password == "") {
            $("#help-password-login").text("비밀번호를 입력해주세요.")
            $("#input-password").focus()
            return;
        } else {
            $("#help-password-login").text("")
        }
        $.ajax({
            type: "POST",
            url: "/sign_in",
            data: {
                username_give: username,
                password_give: password
            },
            success: function (response) {
                if (response['result'] == 'success') {
                    $.cookie('mytoken', response['token'], {path: '/'});
                    window.location.replace("/")
                } else {
                    alert(response['msg'])
                }
            }
        });
    }


    function sign_up() {
        let username = $("#input-username").val()
        let password = $("#input-password").val()
        let password2 = $("#input-password2").val()
        console.log(username, password, password2)


        if ($("#help-id").hasClass("is-danger")) {
            alert("아이디를 다시 확인해주세요.")
            return;
        } else if (!$("#help-id").hasClass("is-success")) {
            alert("아이디 중복확인을 해주세요.")
            return;
        }

        if (password == "") {
            $("#help-password").text("비밀번호를 입력해주세요.").removeClass("is-safe").addClass("is-danger")
            $("#input-password").focus()
            return;
        } else if (!is_password(password)) {
            $("#help-password").text("비밀번호의 형식을 확인해주세요. 영문과 숫자 필수 포함, 특수문자(!@#$%^&*) 사용가능 8-20자").removeClass("is-safe").addClass("is-danger")
            $("#input-password").focus()
            return
        } else {
            $("#help-password").text("사용할 수 있는 비밀번호입니다.").removeClass("is-danger").addClass("is-success")
        }
        if (password2 == "") {
            $("#help-password2").text("비밀번호를 입력해주세요.").removeClass("is-safe").addClass("is-danger")
            $("#input-password2").focus()
            return;
        } else if (password2 != password) {
            $("#help-password2").text("비밀번호가 일치하지 않습니다.").removeClass("is-safe").addClass("is-danger")
            $("#input-password2").focus()
            return;
        } else {
            $("#help-password2").text("비밀번호가 일치합니다.").removeClass("is-danger").addClass("is-success")
        }
        $.ajax({
            type: "POST",
            url: "/sign_up/save",
            data: {
                username_give: username,
                password_give: password
            },
            success: function (response) {
                alert("회원가입을 축하드립니다!")
                window.location.replace("/login")
            }
        });

    }

    function toggle_sign_up() {
        $("#sign-up-box").toggleClass("is-hidden")
        $("#div-sign-in-or-up").toggleClass("is-hidden")
        $("#btn-check-dup").toggleClass("is-hidden")
        $("#help-id").toggleClass("is-hidden")
        $("#help-password").toggleClass("is-hidden")
        $("#help-password2").toggleClass("is-hidden")
    }

    function is_nickname(asValue) {
        var regExp = /^(?=.*[a-zA-Z])[-a-zA-Z0-9_.]{2,10}$/;
        return regExp.test(asValue);
    }

    function is_password(asValue) {
        var regExp = /^(?=.*\d)(?=.*[a-zA-Z])[0-9a-zA-Z!@#$%^&*]{8,20}$/;
        return regExp.test(asValue);
    }

    function check_dup() {
        let username = $("#input-username").val()
        console.log(username)
        if (username == "") {
            $("#help-id").text("아이디를 입력해주세요.").removeClass("is-safe").addClass("is-danger")
            $("#input-username").focus()
            return;
        }
        if (!is_nickname(username)) {
            $("#help-id").text("아이디의 형식을 확인해주세요. 영문과 숫자, 일부 특수문자(._-) 사용 가능. 2-10자 길이").removeClass("is-safe").addClass("is-danger")
            $("#input-username").focus()
            return;
        }
        $("#help-id").addClass("is-loading")
        $.ajax({
            type: "POST",
            url: "/sign_up/check_dup",
            data: {
                username_give: username
            },
            success: function (response) {

                if (response["exists"]) {
                    $("#help-id").text("이미 존재하는 아이디입니다.").removeClass("is-safe").addClass("is-danger")
                    $("#input-username").focus()
                } else {
                    $("#help-id").text("사용할 수 있는 아이디입니다.").removeClass("is-danger").addClass("is-success")
                }
                $("#help-id").removeClass("is-loading")

            }
        });
    }



회원가입까지는 작동이 되었는데 로그인 클라이언트랑 서버를 입력했을 때 웹사이트에서 로그인 버튼을 클릭하면 다음 페이지로 넘어가지 않습니다.

코드는 똑같이 넣은것 같은데 이유가 뭘까요??

제 생각에는 서버 함수 home()에서 payload 변수가 사용되지 않아서 그런 것 같은데 어떻게 해야되는지 모르겠습니다.

취소
 공유
취소
댓글 0
댓글 알림
나의얼굴