22.01.12 Error Handling

> 해결된 에러라면 라벨에 'Complete' 를 달아주세요.
> 미해결된 에러라면 라벨을 'In progress' 로 변경해주세요.

### 어떤 에러인가요?
- 중복 아이디로 회원가입시에 서버에서
```
return res.status(400).json({ message: '중복된 아이디입니다.' });
```
로 보내주게 설정되어 있다.
그리고 클라에서 결과값(res)에서 해당 message를 콘솔로 찍어보고 싶었다.
```
.then((res) => {
console.log(res)
if(res.data.message === 'success') {
handleLoginModal();
} else if(res.data.message === '중복된 아이디입니다.') {
setErrorMessage('중복된 아이디입니다.');
}
})
```

### 에러 메시지

```bash
Error: Request failed with status code 400
at createError (createError.js:16)
at settle (settle.js:17)
at XMLHttpRequest.handleLoad (xhr.js:69)
```

클라에서 콘솔로 찍고 싶은 message는 보이지 않는다.
### 에러 핸들링 방법

- 핸들링 방법에 대해서 간단하게 기록해보세요.
http 상태번호 (400)는 err로 처리되어서 클라에서 catch 키워드로 잡힌다.
그래서 err.response를 콘솔로 찍어 보았다.

```js
.catch((err) => {
console.log(err.response)
})
```
아래에서 보면 err 객체에 담겨있다.
```
{data: {…}, status: 400, statusText: 'Bad Request', headers: {…}, config: {…}, …}
config: {url: 'http://localhost:4000/user/signup', method: 'post', data: '{"userInfo":{"userId":"test5","userNickName":"나는 알지요","password":"1221sion"}}', headers: {…}, transformRequest: Array(1), …}
data:
message: "중복된 아이디입니다."
[[Prototype]]: Object
headers: {content-length: '43', content-type: 'application/json; charset=utf-8'}
request: XMLHttpRequest {readyState: 4, timeout: 0, withCredentials: true, upload: XMLHttpRequestUpload, onreadystatechange: ƒ, …}
status: 400
statusText: "Bad Request"
[[Prototype]]: Object
```

### 에러 핸들링을 위해 참고한 레퍼런스 링크

[링크](https://stackoverflow.com/questions/65604909/axios-createerror-js16-uncaught-in-promise-error-request-failed-with-status)