* 케이스를 마주할 때마다 업데이트 할 예정
Frontend 에서 처리하기 용이하면서도 RESTful API 관점을 잃지 않고 HTTP 응답 상태 코드를 어떻게 약속할지에 대한 생각과 의견이다.
상태 코드 Case
1. GET 조회 시 빈 데이터
- customer/order/{userId} : userId 에 해당하는 order 리스트를 조회했는데, 해당 유저의 오더 건이 없는 경우
- product?word={text} : 쿼리로 조회시 검색 결과가 없는 경우
[응답]
status : 200
response : {
result : true,
data: []
}
[추가 고려사항]
- result : true / false 의 용도를 어떻게 정의해야 하는가?
- 사실상 result : false 인 케이스는 없지 않을까? 필요하긴 한가? -> 일단 현재는 필요없다고 생각함
[UI]
2. GET 조회 시 존재하지 않는 데이터 (자원이 없음)
- product/{productId} : productId 로 조회하는 페이지에서 해당 ProductId 가 없는 경우
[응답]
status: 404
message : "존재하지 않는 제품입니다."
[UI]
[Other Case]
- 500 에러로 리턴 : 에러코드의 의미가 맞지 않음
status: 500
message : "존재하지 않는 제품입니다."
- 200에 result: false 로 리턴 : 해당 케이스는 성공이 아님
status: 200
response : {
result: false,
status: 404,
message: "존재하지 않는 제품입니다."
subCode: "NOT_FOUND"
}
3. PUT/DELETE 수정/삭제시 없는 데이터를 수정/삭제 하려는 경우 (자원이 없음)
[응답]
status: 404
message : "존재하지 않는 제품입니다."
[UI]
- 사이트 내부적으로 사용하는 alert 를 띄우고, 요청내용이 처리되지 않도록 처리, 이전 페이지로 이동
[Other Case]
- 500 에러로 리턴 : 에러코드의 의미가 맞지 않음
status: 500
message : "존재하지 않는 제품입니다."
- 200에 result: false 로 리턴 : 해당 케이스는 성공이 아님
status: 200
response : {
result: false,
status: 404,
message: "존재하지 않는 제품입니다."
subCode: "NOT_FOUND"
}
4. Client 의 잘못된 요청 - Bad Request
- 요청을 보내는 파라미터 값 (path, query, body) 이 유효하지 않은 경우
- Type 불일치, 필수값 누락 등
[응답]
status : 400
message: "[channelSapCode] : 공백일 수 없습니다"
[UI]
1. GET & 잘못된 queryKey : 메인 페이지로 리다이렉트
2. GET & 잘못된 queryKey : 빈 데이터와 동일하게 처리
- 사실상 올바른 queryKey 에는 "" 빈 스트링이 들어온 것으로 보고, 빈 데이터 결과를 리턴함
3. GET & queryKey 데이터 타입 불일치 : 에러 페이지로 리턴
https://www.airbnb.co.kr/?monthly_start_date=2024-03-01
- 아래와 같이 date 형식을 다르게 보냈을 때
https://www.airbnb.co.kr/?monthly_start_date=20240301
4. PUT/POST 에서 전달 하는 데이터의 형식이 올바르지 않는 경우
- 사실상 프론트와 백이 동일한 로직으로 걸러주어야 함
- 만에하나 백으로 넘어왔을 경우, 사이트 내부적으로 사용하는 alert 를 띄우고, 요청내용이 처리되지 않도록 처리
'programming > Web' 카테고리의 다른 글
[React] S3 Url 일정 시간 동안 not Found 리턴 되는 경우 Video 처리 방안 (0) | 2024.02.23 |
---|---|
소셜 로그인 - 카카오 로그인 CORS 에러 발생할 때 - NextJS (frontend) (1) | 2024.02.07 |
JWT 로 로그인 인증 구현하기 (0) | 2023.05.10 |
AWS amplify 로 React 배포하기 (+ blank 빈 페이지 보이는 에러 잡기) (0) | 2023.04.20 |
구글 로그인 라이브러리 변경 - 4. 라이브러리를 사용하지 않고 google OAuth 로 direct 요청 방식 구현 (1) | 2023.01.23 |