Flask, pymongo, dnspython
(크롤링 위한 인터프리터 :) requests, bs4
meta 태그 : 부분에 들어가는, 눈으로 보이는 것(body) 외에 사이트의 속성을 설명해주는 태그들
예) 카톡으로 사이트 공유 시 이미지, 제목, 설명 등이 자동으로 뜨는 것은 그 사이트에 심어놓은 메타 태그를 가져왔기 때문
보스베이비 네이버영화 사이트
해당 사이트 메타 태그 :
import requests
from bs4 import BeautifulSoup
url = 'https://movie.naver.com/movie/bi/mi/basic.naver?code=191597'
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,headers=headers)
soup = BeautifulSoup(data.text, 'html.parser')
title = soup.select_one('meta[property="og:title"]')['content']
image = soup.select_one('meta[property="og:image"]')['content']
desc = soup.select_one('meta[property="og:description"]')['content']
print(title, image, desc)
(주어진 뼈대에서 시작)
API 만들기 :
1 요청 정보 : URL= /movie, 요청 방식 = POST
2 클라(ajax) → 서버(flask) : url, star, comment
3 서버(flask) → 클라(ajax) : 메시지를 보냄 (포스팅 완료!)
: 클라가 서버에 url, star, comment를 주면 서버가 url에서 크롤링해 DB에 image, title, description, star, comment를 저장 후 클라에 완료 메시지 보냄
서버(app.py)와 클라이언트(index.html) 코드를 완성하기
1 서버와 클라 연결 확인
2 서버부터 제작
3 클라 제작
4 완성 확인(DB에 잘 들어갔는지 확인)
POST 요청 API 코드(서버)
from flask import Flask, render_template, request, jsonify
import requests
from bs4 import BeautifulSoup
from pymongo import MongoClient
client = MongoClient('mongodb+srv://test:sparta@cluster0.dvplohg.mongodb.net/Cluster0?retryWrites=true&w=majority')
db = client.dbsparta
...(생략)...
@app.route("/movie", methods=["POST"])
def movie_post():
url_receive = request.form['url_give']
star_receive = request.form['star_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')
title = soup.select_one('meta[property="og:title"]')['content']
image = soup.select_one('meta[property="og:image"]')['content']
desc = soup.select_one('meta[property="og:description"]')['content']
doc = {
'title': title,
'image': image,
'desc': desc,
'star': star_receive,
'comment': comment_receive
}
db.movies.insert_one(doc)
return jsonify({'msg': '저장 완료!'})
...(생략)...
POST 요청 ajax 코드(클라이언트)
function posting() {
let url = $('#url').val()
let star = $('#star').val()
let comment = $('#comment').val()
$.ajax({
type: 'POST',
url: '/movie',
data: {url_give:url, star_give:star, comment_give:comment},
success: function (response) {
alert(response['msg'])
window.location.reload()
}
});
}
(기록하기 버튼에 연결된 posting() 함수)
1. 서버에 전달할 url, star, comment를 id값에서 꺼내와 서버에 넘겨준다
2. 완료되면 API에서 받은 '저장 완료!' 메시지를 띄운 후 창 새로고침
API 만들기 :
1 요청 정보 : URL= /movie, 요청 방식 = GET
2 클라(ajax) → 서버(flask) : (없음)
3 서버(flask) → 클라(ajax) : 전체 영화를 보내주기
: 클라가 서버에 줄 데이터 없음. 서버는 클라에 DB에 저장된 리뷰 보내줌
서버(app.py)와 클라이언트(index.html) 코드를 완성하기
1 서버와 클라 연결 확인
2 서버부터 제작
3 클라 제작
4 완성 확인(새로고침 시 DB에 저장된 리뷰가 화면에 나오는지 확인)
GET 요청 API 코드(서버)
@app.route("/movie", methods=["GET"])
def movie_get():
movie_list = list(db.movies.find({}, {'_id': False}))
return jsonify({'movies': movie_list})
GET 요청 ajax 코드(클라이언트)
$(document).ready(function () {
listing();
});
function listing() {
$.ajax({
type: 'GET',
url: '/movie',
data: {},
success: function (response) {
let rows = response['movies']
for(let i = 0;i<rows.length;i++) {
let comment = rows[i]['comment']
let desc = rows[i]['desc']
let image = rows[i]['image']
let star = rows[i]['star']
let title = rows[i]['title']
let star_image = '⭐'.repeat(star)
temp_html = `<div class="col">
<div class="card h-100">
<img src=${image}
class="card-img-top">
<div class="card-body">
<h5 class="card-title">${title}</h5>
<p class="card-text">${desc}</p>
<p>${star_image}</p>
<p class="mycomment">${comment}</p>
</div>
</div>
</div>`
$('#cards-box').append(temp_html)
}
}
})
}
실습 종료