codestates / codestates/underTheSea
[Issue: 에러 핸들링 템플릿] 송다영 2022.01.07
- 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.