[TIL] 221228

😀 TIL #221228

 

- 스파르타 코딩클럽 웹개발 종합반 4주차

 

4주차 4회~ 4주차 8회

 

* GET, POST 요청으로 서버와 클라이언트 간 데이터 주고받기

 클라이언트와 서버는 유기적으로 요청을 주고 받는다.

 오고가는 플로우를 잘 살펴가며 공부를 해보았다.

 

일단, 오늘의 문제

Q. DB Atlas 사용시, pymongo.errors.ServerSelectionTimeoutError: ~ [SSL: CERTIFICATE_VERIFY_FAILED]~ 를 포함한 에러 메시지 확인

A. certifi 패키지를 가상환경에 먼저 설치 후, 아래처럼 pymongo 기본세팅 변경

from pymongo import MongoClient
import certifi

ca = certifi.where()

client = MongoClient('mongodb+srv://test:sparta@cluster0.내주소.mongodb.net/내DB명?retryWrites=true&w=majority', tlsCAFile=ca)
db = client.dbsparta

 

근데, 또 안된다. DNS 어쩌구 ~ 하는 오류 코드가 뜬다.

A. DB Atals 페이지 network access 메뉴에서 ADD IP ADDRESS 버튼 클릭 후, 0.0.0.0/0 등록

0.0.0.0/0 는 모든 IP 주소를 뜻한다. 가입 당시의 컴퓨터 IP 로만 접근이 가능하게 세팅되는데, 이를 해결하기 위한 방법이다.

(실제 프로젝트 시에는 보안상의 문제로 모든 IP로 세팅해두지 않음, add current ip adress 기능 사용)

 

근데, 또 안된다.. 여전히 사라지지 않는 DNS 어쩌구 ~ 오류코드

A. 내 인터넷 접속환경과 방화벽 설정에서 SRV URI (예. mongodb+srv: 처럼 srv 방식으로 적힌 URI) 자체를 접속이 되지 않게 막는 경우가 있어 다른 url 주소를 불러오면 된다.

 

고마워 스파르타

 

아무튼 이렇게 힘들게 mongodb와 연동된 로컬 서버 환경을 만들어주고

서버와 클라이언트가 데이터를 주고 받을 수 있는 코드를 짜보자.

 

//서버 코드 - app.py
@app.route("/mars", methods=["POST"])	//mars url에서 post 요청으로 가져올거야
def mars_post():
    name_receive = request.form['name_give']	//name_give를 받아와
    address_receive = request.form['address_give']	//address_give를 받아와
    size_receive = request.form['size_give']	//size_give를 받아와

    doc = {
        'name': name_receive,
        'address': address_receive,
        'size': size_receive
    }

    db.mars.insert_one(doc)		//받아온 내용을 내 db(mars) 에 저장해

    return jsonify({'msg': '주문 완료!'})	//저장 후에 '주문완료' 라는 메시지를 반환하자

 

//클라이언트 코드 - index.html
function save_order() {		//save order 함수 -> 구매하기 버튼에 onclick 되어 있음
    let name = $('#name').val()		//id=name 값을 가져와서 name 이라고 해
    let address = $('#address').val()		//id=address 값을 가져와서 address 이라고 해
    let size = $('#size').val()		//id=size 값을 가져와서 size 이라고 해

    $.ajax({
        type: 'POST',
        url: '/mars',
        data: { name_give:name, address_give:address, size_give:size },	//어쩌구_give 데이터를 보낼거야
        success: function (response) {
            alert(response['msg'])		//성공하면 msg값을 받아와
            window.location.reload()	//그리고 새로고침 해
        }
    });
}

 

제대로 작동한다!

아직 정확하게 이해가 가는건 아니라 이야기 읽어주듯 스토리텔링으로 데이터 주고 받는 감을 익히고 있다.