커뮤니티
포인트
로딩중
쿠폰
내 강의실
국비 신청 내역
수강권
증명서
숙제 피드백
계정
로그아웃
학습 질문
개발 일지
나의 활동
답변 완료
Python flask에서 html로 값 전달하기 추가 질문
[왕초보] 비개발자를 위한, 웹개발 종합반 (프로그래밍 실무, 풀스택)
기타
신*민
댓글
21
・
추천
1
・
조회수
50
조회수
50
답변 완료
질문이 또 있습니다.
- html에서 검색 값을 input box(또는 option list item)로 받아와서, 이걸 파라미터로 해서 공공데이터 포털에서 API값을 가져온 후,
- 가져온 값들을 다시 html에 일정한 형태로 출력해주는 페이지를 만들어 보는 중입니다.
그런데, 위 1.은 성공했는데, 2.가 안됩니다.
코드는 아래와 같습니다.
(서버)
import requests
from bs4 import BeautifulSoup
from flask import Flask, render_template, request, jsonify
app = Flask(__name__)
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'}
url = 'http://openapi.molit.go.kr/OpenAPI_ToolInstallPackage/service/rest/RTMSOBJSvc/getRTMSDataSvcLandTrade'
ekey = '인코딩키'
dkey = '디코딩키'
@app.route('/')
def home():
return render_template('index.html')
@app.route("/deals", methods=["POST"])
def deals_list():
cd_receive = request.form['cd_give']
ymd_receive = request.form['ymd_give']
params ={'serviceKey' : dkey,
'LAWD_CD' : cd_receive,
'DEAL_YMD' : ymd_receive
}
doc = []
xml = requests.get(url, params, headers=headers).text
soup = BeautifulSoup(xml, 'xml')
#값을 가져올 하위 태그 지정하여 find_all 함수(?) 적용하기
items = soup.find_all('item')
for item in items:
doc.append({
'시군구': item.find('시군구').text,
'법정동': item.find('법정동').text,
'년': item.find('년').text,
'월': item.find('월').text,
'일': item.find('일').text,
'거래면적': item.find('거래면적').text,
'거래금액': item.find('거래금액').text,
'용도지역': item.find('용도지역').text
})
print(doc)
return jsonify({'result': doc})
# return doc
if __name__ == '__main__':
# app.run('0.0.0.0', port=5000, debug=True)
app.run('0.0.0.0', 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">
<link rel="stylesheet" href="../static/style.css">
<script>
function listing() {
let local_cd = $('#local_cd').val()
let deal_ymd = $('#deal_ymd').val()
// let temp_html = ``
// $('#result').empty()
$.ajax({
type: 'POST',
url: '/deals',
data: {cd_give: local_cd, ymd_give: deal_ymd},
success: function (response) {
let rows = response['result']
for (let i = 0; i < rows.length; i++) {
let si_gu = rows[i]['시군구']
let dong = rows[i]['법정동']
// let ymd = rows[i]['년'] & rows[i]['월'] & rows[i]['일']
let size = rows[i]['거래면적']
let amount = rows[i]['거래금액']
let usedfor = rows[i]['용도지역']
console.log(dong)
console.log(rows.length)
temp_html = `<li>${si_gu}${dong}${size}${amount}${usedfor}</li>`
$('#result').append(temp_html)
}
}
})
}
</script>
</head>
<body>
<div class="full-screen-container">
<div class="login-container">
<h1 class="login-title">Welcome</h1>
<form class="form">
<div class="input-group success">
<label for="local_cd">키워드 입력</label>
<input type="text" name="local_cd" id="local_cd">
<span class="msg">Valid local_cd</span>
</div>
<div class="input-group error">
<label for="deal_ymd">키워드 입력</label>
<input type="text" name="deal_ymd" id="deal_ymd">
<span class="msg">Valid deal_ymd</span>
</div>
<button onclick="listing()" type="submit" class="login-button">검색</button>
</form>
</div>
</div>
<div class="result">
<h1 style="text-align:center">검색 결과</h1>
<div style="text-align:center">
<li id="result">결과 출력</li>
</div>
</div>
</body>
</html>
이렇게 하면, 서버쪽 터미널에서는 값을 가져온게 보입니다.
그러나, 클라이언트 쪽은 반응이 없습니다. 콘솔도 그렇구요...
뭘 잘못한 걸까요?
감사합니다~!!!
댓글 알림
