커뮤니티
포인트
쿠폰
내 강의실
국비 신청 내역
증명서
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
4-13 이해가 되질않아요
undefined주차
북마크
박*원
댓글
7
추천
0
조회수
15
조회수
15
답변 완료

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

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


홈페이지가 켜지지 않고 강사님꺼보면서 하는데 너무 어려워요







작성한 코드 및 에러 메세지

from flask import Flask, render_template, request, jsonify

app = Flask(__name__)


from pymongo import MongoClient

client = MongoClient('mongodb+srv://sparta:test@sparta.ybx1prz.mongodb.net/?retryWrites=true&w=majority')

db = client.dbsparta


import requests

from bs4 import BeautifulSoup


@app.route('/')

def home():

    return render_template('index.html')


@app.route("/movie", methods=["POST"])

def movie_post():

    url_receive = request.form['url_give']

    comment_receive = request.form['comment_give']


    headers = {'User-Agent' : 'Mozilla/5.0 (Windows NT 10.0; Win64; x64)AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.86 Safari/537.36'}

    data = requests.get(url_receive,headers=headers)


    soup = BeautifulSoup(data.text, 'html.parser')


    ogtitle = soup.select_one('meta[property="og:title"]')['content']

    ogimage = soup.select_one('meta[property="og:image"]')['content']

    ogdesc = soup.select_one('meta[property="og:description"]')['content']

   

    doc = {

        'title':ogtitle,

        'desc':ogdesc,

        'image':ogimage,

        'comment':comment_receive

    }

    db.movies.insert_one(doc)

   

    return jsonify({'msg':'저장완료!'})


@app.route("/movie", methods=["GET"])

def movie_get():

    return jsonify({'msg':'GET 저장완료!'})


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>스파르타 피디아</title>


    <link href="https://fonts.googleapis.com/css2?family=Gowun+Dodum&display=swap" rel="stylesheet">


    <style>

        * {

            font-family: 'Gowun Dodum', sans-serif;

        }


        .mytitle {

            width: 100%;

            height: 250px;


            background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('https://movie-phinf.pstatic.net/20210715_95/1626338192428gTnJl_JPEG/movie_image.jpg');

            background-position: center;

            background-size: cover;


            color: white;


            display: flex;

            flex-direction: column;

            align-items: center;

            justify-content: center;

        }


        .mytitle>button {

            width: 200px;

            height: 50px;


            background-color: transparent;

            color: white;


            border-radius: 50px;

            border: 1px solid white;


            margin-top: 10px;

        }


        .mytitle>button:hover {

            border: 2px solid white;

        }


        .mycomment {

            color: gray;

        }


        .mycards {

            margin: 20px auto 0px auto;

            width: 95%;

            max-width: 1200px;

        }


        .mypost {

            width: 95%;

            max-width: 500px;

            margin: 20px auto 0px auto;

            padding: 20px;

            box-shadow: 0px 0px 3px 0px gray;


            display: none;

        }


        .mybtns {

            display: flex;

            flex-direction: row;

            align-items: center;

            justify-content: center;


            margin-top: 20px;

        }


        .mybtns>button {

            margin-right: 10px;

        }

    </style>

    <script>

        $(document).ready(function () {

            listing();

        });


        function listing() {

            fetch('/movie').then((res) => res.json()).then((data) => {

                console.log(data)

                alert(data['msg'])

            })

        }


        function posting() {

            let url = $('url').val()

            let comment = $('comment').val()


            let formData = new FormData();

            formData.append("url_give", url);

            formData.append("comment_give", comment);


            fetch('/movie', { method: "POST", body: formData }).then((res) => res.json()).then((data) => {

                alert(data['msg'])

                window.location.reload

            })

        }


        function open_box() {

            $('#post-box').show()

        }

        function close_box() {

            $('#post-box').hide()

        }

    </script>

</head>


<body>

    <div class="mytitle">

        <h1>내 생애 최고의 영화들</h1>

        <button onclick="open_box()">영화 기록하기</button>

    </div>

    <div class="mypost" id="post-box">

        <div class="form-floating mb-3">

            <input id="url" type="email" class="form-control" placeholder="name@example.com">

            <label>영화URL</label>

        </div>

        <div class="form-floating">

            <textarea id="comment" class="form-control" placeholder="Leave a comment here"></textarea>

            <label for="floatingTextarea2">코멘트</label>

        </div>

        <div class="mybtns">

            <button onclick="posting()" type="button" class="btn btn-dark">기록하기</button>

            <button onclick="close_box()" type="button" class="btn btn-outline-dark">닫기</button>

        </div>

    </div>

    <div class="mycards">

        <div class="row row-cols-1 row-cols-md-4 g-4" id="cards-box">

            <div class="col">

                <div class="card h-100">

                    <img src="https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"

                        class="card-img-top">

                    <div class="card-body">

                        <h5 class="card-title">영화 제목이 들어갑니다</h5>

                        <p class="card-text">여기에 영화에 대한 설명이 들어갑니다.</p>

                        <p>⭐⭐⭐</p>

                        <p class="mycomment">나의 한줄 평을 씁니다</p>

                    </div>

                </div>

            </div>

            <div class="col">

                <div class="card h-100">

                    <img src="https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"

                        class="card-img-top">

                    <div class="card-body">

                        <h5 class="card-title">영화 제목이 들어갑니다</h5>

                        <p class="card-text">여기에 영화에 대한 설명이 들어갑니다.</p>

                        <p>⭐⭐⭐</p>

                        <p class="mycomment">나의 한줄 평을 씁니다</p>

                    </div>

                </div>

            </div>

            <div class="col">

                <div class="card h-100">

                    <img src="https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"

                        class="card-img-top">

                    <div class="card-body">

                        <h5 class="card-title">영화 제목이 들어갑니다</h5>

                        <p class="card-text">여기에 영화에 대한 설명이 들어갑니다.</p>

                        <p>⭐⭐⭐</p>

                        <p class="mycomment">나의 한줄 평을 씁니다</p>

                    </div>

                </div>

            </div>

            <div class="col">

                <div class="card h-100">

                    <img src="https://movie-phinf.pstatic.net/20210728_221/1627440327667GyoYj_JPEG/movie_image.jpg"

                        class="card-img-top">

                    <div class="card-body">

                        <h5 class="card-title">영화 제목이 들어갑니다</h5>

                        <p class="card-text">여기에 영화에 대한 설명이 들어갑니다.</p>

                        <p>⭐⭐⭐</p>

                        <p class="mycomment">나의 한줄 평을 씁니다</p>

                    </div>

                </div>

            </div>

        </div>

    </div>

</body>


</html>


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