codestates / codestates/underTheSea

[Issue: 에러 핸들링 템플릿] 송다영 2022.01.07

Open
#49 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
0
Forks
5
PR merge metrics
No merged PRs in 30d

Description

> 'Complete'

### 어떤 에러인가요?
- 로그인을 위한 axios의 post 요청 중 then 다음 if문에서 response를 받아오지 못했습니다.
- 회원 탈퇴를 위해서 axios사용 중 오류가 발생하였습니다.

### 에러 메시지

터미널의 에러코드가 많이 떠서 하나하나 체크하기 힘들었습니다.
주로 뜬 에러는 request 404와 response 401입니다.

### 에러 핸들링 방법

- 핸들링 방법에 대해서 간단하게 기록해보세요.

Login의 핸들링

- 대표적인게 중간에 Props에 {}를 안쳐줘서 상태가 전달되지 않았습니다. 그래서 then을 넘어서 함수가 실해되지 않았습니다.
- 서버의 Login.js에서 애초에 401로 요청을 막고 있었기 때문에 계속 오류가 떠서 200으로 바꾸어 해결하였습니다.

SignOut의 핸들링

- API를 잘 못 설정하여서 /user/signout --> /user에서 바꾸었습니다.
- Headers를 headers: { Authorization: `Bearer ${accessToken}` }로 재설정하였습니다.

```js
//page : Login.js

if (email && user_pwd) {
axios
.post(`http://localhost:80/user/login`, { data: userData })
.then((res) => {
// console.log(res.headers);
if (res.data.token) {
// console.log("res-->", res);
handleAccessToken(res.data.token);
handleL();
navigate("/mypage");
}
})
.then(() => {})
.catch((err) => {
if (err) {
setInvalidLogin(true);
}
});
}};
```

```js
//page : SignOut.js

const navigate = useNavigate();
function signOut() {
axios
.delete("http://localhost:80/user", {
headers: { Authorization: `Bearer ${accessToken}` },
})
.then(() => {
setIsLogin(false);
navigate("/");
});
}

```

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

- 팀원들과 함께 의논하면서 console을 찍다보니 해결되어서 따로 링크는 없습니다.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.