Ajax로 서버와 비동기 통신을 할 때 보통 json 데이터 형식으로 데이터를 주고 받습니다. 원래는 아래와 같이 클라이언트단 코드를 작성하고 서버단 코드를 작성해도, 문제 없이 클라이언트가 보내는 데이터를 서버에서 잘 받았습니다.
안 되는 코드
클라이언트
$.ajax({
type: "POST",
url: "{{url_for('hello')}}",
contentType: 'application/json',
dataType: 'JSON',
data: {
num: 1
},
success: function(report){
console.log('성공');
}
});
서버
@app.route("/hello", methods=["POST"])
def hello():
req = request.get_json()
num = req['num']
print(num)
res = make_response(jsonify({'message':'성공'}), 200)
return res
그런데 오늘 위와 같은 방식으로 코드를 짰더니 자꾸 400 오류가 나고 클라이언트가 보낸 데이터를 서버가 받지 못하였습니다.
참고로 4xx 응답 상태 코드는 클라이언트가 요청을 잘못했을 때 생기는 에러입니다.
'원래 되었던 코드로 기억하는데 왜 안되지?' 한참 헤매다가 결국 해결법을 찾았습니다.
되는 코드
클라이언트
해결법은 보낼 데이터를 먼저 변수로 선언한 다음에 그것을 JSON.stringfy 함수 처리한 것을 보내는 것입니다.
var test = {'num':1}
$.ajax({
type: "POST",
url: "{{url_for('hello')}}",
contentType: 'application/json',
dataType: 'JSON',
data: JSON.stringfy(test),
success: function(report){
console.log('성공');
}
});
서버
서버 코드는 위와 동일합니다.
이렇게 클라이언트단의 코드를 수정해줬더니 정상적으로 서버로 데이터가 전송되었습니다. 혹시 같은 문제로 헤매고 계신 분들에게 이 글이 도움이 되길 바랍니다.
'코딩 > flask' 카테고리의 다른 글
[Flask] Flask API 서버에 인증 기능 넣기 (0) | 2023.02.19 |
---|---|
[flask] ModuleNotFoundError: No module named 'wtforms.fields.html5' 에러 해결 방법 (2) | 2023.01.31 |
[flask+jinja2] flask 프로젝트에서 html에 이미지 삽입하는 방법 (0) | 2022.08.09 |
[flask] ubuntu에 flask_mysqldb 설치 중 에러 해결 방법 (0) | 2022.07.14 |
[flask+jinja2] 반올림하기, round 필터 (0) | 2022.03.19 |
[flask+jinja2] 서버에서 받은 html 요소가 html 문서에서 제대로 표현되게 하려면? (0) | 2022.02.06 |
[flask+jinja2] break 사용하기 (2) | 2022.02.05 |
[flask] rows에서 각 row가 몇 번째 것인지 보여주고 싶다면? (0) | 2021.05.15 |