웹개발 프로젝트 : (4) 웹페이지 1차 완성

(2)에서 말했던 해야 할 과제들!

오늘 완성을 했다 ㅎ_ㅎ

 

일단 DB에 저장하는 코드는 어제 다 짰는데 공항 API 사이트에 너무 많이 접근해서....

내 서버가 막혀벌임ㅜㅜ

그래서 더이상 DB를 저장하지 못하고 오늘 와서 다시 저장을 했다

하다보니 이거 API 접근하는 데에 한계가 좀 있는 것 같다 ㅋㅋㅋㅋㅋ

118개 저장했더니 바로 또 끊겼음ㅠㅠ

 

일단 DB에 저장이 잘 되는 것은 확인이 되어서,

저장된 데이터들만 가지고 웹페이지 구축을 시작했다.

 

문제

가장 헤맸던 부분은 저 위 사진에서,

 

2. 웹페이지 구축하기

1) 검색한 공항을 DB에서 GET하여

 

라고 써놨는데 알고보니 GET으로 가져오는게 아니어서......ㅋ

그 부분에서 가장 많이 헤맸다 ㅠㅠ

 

클라이언트에서 설정한 변수를 GET을 통해 보내고 GET function이 실행되어서 DB에서 정보를 갖고오고,

갖고온 정보를 다시 클라이언트로 넘겨주려고 했는데

 

일단 클라이언트에서 설정한 변수를 GET으로 보내주는 것부터 안됐다 ㅋㅋㅋ

 

생각해보면 당연한 게 GET의 방향 자체가 서버 > 클라이언트니까...

클라이언트 > 서버로의 통신이 안되는게... 뭐... 당연한 거지...

 

그러면 POST로 받은 정보를 GET에서 그대로 가져올 수는 없을까? 해서

파이썬 전역 변수를 써봤는데 그게 먹히지를 않더라. 왤까??? 이건 멘토링할 때 질문해봐야겠음.

 

해결

이것저것 막 해보다가 결국 성공한 방법은 좀..어,,, 허무(?) 했는데... ㅠㅠㅎㅎ

 

서버의 POST 함수 내에서 클라이언트로 보내주면 되는거였다...

흐름이 어떻게 되냐하면

 

클라이언트에서 정보를 받아 서버에 넘김 > 서버가 DB에서 정보 찾아서 변수로 만들고 > 클라이언트로 넘겨줌

 

이 모든 과정이 POST 내에서 가능했는데, return이 있다는 것을 눈치채고 나서 성공을 했던 것 같다 ㅋㅋㅋ

메시지 대신 변수를 보내주면 되는거 아닌가...? 해서

변수를 보냈더니 우왁 ! 성공 !

 

결국 클라이언트에서 POST가 성공하면 이걸 해줘 ~ 내부에

1. 가져온 변수에서 정보 좀 받아줘~

2. 그 정보 가지고 지도 바꾸고,

3. 테이블에 내용도 바꿔주라

 

이렇게 수정을 해서 성공을 하였다 ~!

아 테이블 내용은 append가 아닌 수정(modify)를 하고 싶었는데 검색한 결과,

일단 테이블 내용을 .empty < 요 커멘드로 지우고 나서 바로 .append를 붙여주면 가능했다

 

여러모로 한국어로 검색하는 것보다 영어로 검색할 때 정답이 잘 나왔던 것 같음 ㅠㅠㅋㅋ

 

암튼 성공하니 몹시 뿌-듯

결과물

궁금한 점

1. 서버 구동하는 파이썬 코드 내에서 전역 변수를 설정해도 왜 다른 함수에서 인식을 못할까???

2. POST에서 정보랑 메시지 둘 다 클라이언트로 보내고 싶은데 왜 안될까,,,?

    return jsonify({'airport_info': airport_info})
    # return jsonify({'airport_info': airport_info}, {'msg': '찾기 완료!'})

주석 설정해놓은 걸로 보내면 변수 인식 자체가 안됐음ㅜㅜ

 

> 멘토링에서 알려주심

 

1. 전역변수 설정은 맨 처음부터 해야한다

from flask import Flask, render_template, request, jsonify

import requests, json
from bs4 import BeautifulSoup

app = Flask(__name__)

from pymongo import MongoClient
import certifi

ca = certifi.where()

예를 들어 위 코드에서 함수로 들어가기 전 app, ca 등이 전역변수가 될 수 있는 것.

그렇지만 전역변수를 설정하는 것은 비추하셨다.

왜냐하면 전역변수로 설정을 하게 되면 변수의 상태가 자꾸 바뀌게 되어서, 좋지 않다는 것!

무슨 뜻인가 하면... 처음 서버를 킬 때 전역변수는 받은 내용이 아무것도 없으니 [] < 이렇게 공백이다가, 

클라이언트와 통신하면서 전역변수에 [내용] < 이렇게 내용이 생기게 되는데,

공백-내용-공백-내용 이렇게 상태를 자꾸 변경하면 비효율적이고 컴퓨터 입장에서 좀 헷갈리는...? 그런 문제가 있다고 하셨다!

전역변수 설정은 가급적 하지 않는 것으로 ~! + 변하지 않는 상수에 대해서만 설정해주는 것으로!

 

2. 내용을 보낼 때는 한꺼번에 보내야 한다

#return jsonify({'airport_info': airport_info}, {'msg': '찾기 완료!'})
return jsonify({'airport_info': airport_info, 'msg': '찾기 완료!'})

위 코드의 주석처럼, {} <얘를 두 번 쓰는 게 아니라,

{} < 이 안에 컴마(,)를 이용해서 복수 개의 항목을 보내줘야 한다는 것.

Next Step

생각해보니 ICAO 코드로 공항을 찾는게 너무 구린 것 같아서 ㅋㅋㅋㅋ 이 부분 고민을 좀 해보려고 한다,,,

(심지어 IATA 코드가 더 유명함 ㅠ 차라리 IATA 코드로 찾는게 더 낫겠어...)

그치만 그 전에, 검색어를 자동완성하는 기능을 넣고 싶다.

그 검색하고 있는 알파벳과 앞자리 같은 애들을 쭉 보여주는,, 그런거,,,

아니면 한글명으로 검색했을 때 쭉 보여주는... 그런거...