커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
팬명록 노출 오류
undefined주차
북마크
김*환
댓글
3
・
추천
0
・
조회수
8
조회수
8
답변 완료

* 겪고 있는 문제 상황을 최대한 자세하게 작성해주세요.

* 문제 해결을 위해 어떤 시도를 해보았는지 구체적으로 함께 알려주세요.


몽고 db에는 데이터가 쌓이는데 localhost 5000에는 노출이 안되네여



스파르타 즉문즉답스파르타 즉문즉답




작성한 코드 및 에러 메세지

from flask import Flask, render_template, request, jsonify
app = Flask(__name__)

from pymongo import MongoClient
client = MongoClient("mongodb+srv://test:test@cluster0.jrkmeta.mongodb.net/?retryWrites=true&w=majority")
db = client.dbsparta

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

@app.route("/homework", methods=["POST"])
def homework_post():
    name_receive = request.form['name_give']
    comment_receive = request.form['comment_give']

    doc = {
        'name': name_receive,
        'comment': comment_receive
    }

    db.homework.insert_one(doc)
    return jsonify({'msg':'응원 완료!'})

@app.route("/homework", methods=["GET"])
def homework_get():
    comment_list = list(db.homework.find({},{'_id':False}))
    return jsonify({'comments':comment_list})

if __name__ == '__main__':
   app.run('0.0.0.0', port=5000, debug=True)




<!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 href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
          integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
            crossorigin="anonymous"></script>

    <title>The Weekend</title>
    <link href="https://fonts.googleapis.com/css2?family=Do+Hyeon&family=Hahmlet:wght@400;500;600&family=Jua&family=Noto+Sans+KR&display=swap"
          rel="stylesheet">
</head>
<style>
    * {
        font-family: 'Do Hyeon', sans-serif;

    }

    .mytitle {

        height: 200px;
        width: 100%;

        background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("data:image/jpeg;base64,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");
        background-position: center;
        background-size: auto;

        color: white;

        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .mypost {
        width: 95%;
        max-width: 500px;
        margin: 20px auto 20px auto;

        box-shadow: 0px 0px 3px 0px grey;
        padding: 20px;
    }

    .mybtn {

        margin-top: 15px;
    }

    .wrap {
        width: 95%;
        max-width: 500px;
        margin: auto;
    }

    .wrap > .card {
        margin-top: 10px;
        margin-bottom: 10px;
    }


</style>
<script>
      $(document).ready(function(){
            set_temp()
            show_comment()
        });
        function set_temp(){
            $.ajax({
                type: "GET",
                url: "http://spartacodingclub.shop/sparta_api/weather/seoul",
                data: {},
                success: function (response) {
                    $('#temp').text(response['temp'])
                }
            })
        }
        function save_comment() {
            let name = $('#name').val()
            let comment = $('#comment').val()

            $.ajax({
                type: "POST",
                url: "/homework",
                data: {'name_give':name, 'comment_give':comment},
                success: function (response) {
                    alert(response["msg"])
                    window.location.reload()
                }
            });
        }
        function show_comment() {
            $('#comment-list').empty()
            $.ajax({
                type: "GET",
                url: "/homework",
                data: {},
                success: function (response) {
                    let rows = response['comments']
                    for (let i = 0; i < rows.length; i++) {
                        let name = rows[i]['name']
                        let comment = rows[i]['comment']

                        let temp_html = `<div class="card">
                                            <div class="card-body">
                                                <blockquote class="blockquote mb-0">
                                                    <p>${comment}</p>
                                                    <footer class="blockquote-footer">${name}</footer>
                                                </blockquote>
                                            </div>
                                        </div>`
                        $('#comment-list').append(temp_html)
                    }
                }
            });
        }
    </script>
<body style="background-color: black">
<div class="mytitle">
    <h1>The Weekend 팬명록</h1>
    <p>현재 기온 : <span id="temp"></span></p>
</div>
<div class="mypost">
    <div class="form-floating mb-3">
        <input type="text" class="form-control" id="name" placeholder="url">
        <label for="floatingInput">닉네임</label>
    </div>
    <div class="form-floating">
        <textarea class="form-control" placeholder="Leave a comment here" id="comment" style="height: 100px"></textarea>
        <label for="floatingTextarea2">응원댓글</label>
    </div>
    <div class="mybtn">
        <button onclick="save_comment()" type="button" class="btn btn-dark">응원남기기</button>

    </div>
</div>
<div class="wrap">
    <div class="card">
        <div class="card-body">
            <blockquote class="blockquote mb-0">
                <p>새로운 노래 너무 좋아요!</p>
                <footer class="blockquote-footer">KickthatDrum</footer>
            </blockquote>
        </div>
    </div>
    <div class="card">
        <div class="card-body">
            <blockquote class="blockquote mb-0">
                <p>새로운 노래 너무 좋아요!</p>
                <footer class="blockquote-footer">KickthatDrum</footer>
            </blockquote>
        </div>
    </div>
    <div class="card">
        <div class="card-body">
            <blockquote class="blockquote mb-0">
                <p>새로운 노래 너무 좋아요!</p>
                <footer class="blockquote-footer">KickthatDrum</footer>
            </blockquote>
        </div>
    </div>
</div>


</body>

</html>`





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