API GET방식, POST방식 연습 1

POST 방식

1. 요청 정보 : URL = /mars, 요청 방식= POST

2. 클라이언트(ajax) → 서버(flask) : name, address, size 보내기

from flask import Flask, render_template, request, jsonify
app = Flask(__name__)

from pymongo import MongoClient
client = MongoClient('mongodb+srv://lhm:1234@cluster0.nvjgmst.mongodb.net/?retryWrites=true&w=majority')
db = client.dbsparta
# 전에 만들었던 서버에 데이터 저장하기위함 

@app.route('/')
def home():
    return render_template('index.html')

@app.route("/mars", methods=["POST"]) #mars에서 보낸 데이터 받기
def web_mars_post():
    name_receive = request.form['name_give'] # 받은 값을 변수로 저장하기
    address_receive = request.form['address_give']
    size_receive = request.form['size_give']
    doc = {
        'name': name_receive,
        'address': address_receive,
        'size': size_receive
    } #저장된 변수를 각각의 키의 value로 넣고 이름이 doc인 배열로 저장하기
    db.mars.insert_one(doc) #설정된 데이터베이스의 mars에 변수를 각각의 키 와 value 값 저장하기
    return jsonify({'msg': '주문 완료!'})#데이터베이스에 저장이 완료되면 메세지를 script로 리턴

@app.route("/mars", methods=["GET"])
def web_mars_get():
    return jsonify({'msg': 'GET 연결 완료!'})

if __name__ == '__main__':
    app.run('0.0.0.0', port=5000, debug=True)

3. 서버(flask)  →  클라이언트(ajax) : 메세지를 보내기

<script>
function save_order() {
         let name = $('#name').val() // #name를갖는 태그에 입력된 값을 변수 name에 저장
         let address = $('#address').val() // #address를갖는 태그에 입력된 값을 변수 size에 저장
         let size = $('#size').val() // #size를갖는 태그에 입력된 값을 변수 size에 저장
        $.ajax({
                type: 'POST',
                url: '/mars', //클릭이 되면 각각의 키에 저장된 값을 담아 app.py로 보낸다.
                data: { name_give: name, address_give: address, size_give: size },
                success: function (response) {
                alert(response['msg']) //성공하면 받아온 msg인 '주문 완료!'를 출력한다.
                window.location.reload()// 새로고침을 한다.
                } 
            });
}
</script>

GET방식

1. 요청 정보 : URL = /mars, 요청 방식= GET

2. 클라이언트(ajax) → 서버(flask) : 없음

3. 서버(flask)  →  클라이언트(ajax) : 전체 주문을 보내주고 보여준다.