์์ฉ ํ๋ก๊ทธ๋จ์ ๋ง์ ๋ถ๋ถ์์ [email protected] (0.15.3์ผ๋ก ์
๊ทธ๋ ์ด๋ํด๋ ๋ฌธ์ ๊ฐ ํด๊ฒฐ๋์ง ์์)์ ์ฌ์ฉํ๋ ํ๋ก์ ํธ๊ฐ ์์ต๋๋ค. ์ฑ์ ๋ค๋ฅธ ๋ชจ๋ ๋ถ๋ถ์์ .catch()
422๊ฐ์ ์๋ต ์ฝ๋๋ฅผ ์ฌ์ฉํ ์ ์์ต๋๋ค. ์ต๊ทผ์ ์ฐ๋ฆฌ๋ 1๊ฐ์ ์์ฒญ์ด 422 ์๋ต์ ๋ฐ๋ ์ฝ์์ ํด๊ฒฐํ๊ณ ์์์ ๋ฐ๊ฒฌํ์ต๋๋ค. ์ฐ๋ฆฌ ์ ํ๋ฆฌ์ผ์ด์
์ ๋ค๋ฅธ ๋ชจ๋ ๋ถ๋ถ์์ 422๋ axios ์ฝ์์ด ๊ฑฐ๋ถ๋๋๋ก ํฉ๋๋ค.
export function addTool(name: string): Thunk {
return (dispatch, getState) => {
Axios
.post<Tool>(API.current.toolsPath, { name })
.then(resp => {
if (resp instanceof Error) { throw resp; }
success("Tool has been saved.", "Success");
dispatch(addToolOk(resp.data));
})
.catch((e: Error) => {
dispatch(addToolNo(e));
error(prettyPrintApiErrors(e));
});
};
}
.then()
์ ๋ค์ ์ค์ ์ถ๊ฐํ์ฌ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ ์ ์์์ต๋๋ค.
if (resp instanceof Error) { throw resp; }
์ ์๋ํ์ง๋ง ์ด ํน์ 422๊ฐ ๊ฑฐ๋ถ๋ ๊ฒ์ด ์๋๋ผ ํด๊ฒฐ๋ ์ด์ ์ ๋ํด์๋ ์ฌ์ ํ ํผ๋์ค๋ฝ์ต๋๋ค. ์ฐ๋ฆฌ๋ ๋ํ ์ผ๋ถ ์ธํฐ์ ํฐ ๋ฅผ ์ฌ์ฉํ๊ณ ์์ง๋ง ์ฐ๋ฆฌ๊ฐ ๋ง๋๋ ๋ค๋ฅธ ์์ฒญ์๋ ๋ฌธ์ ๋ฅผ ์ผ์ผํค์ง ์์ต๋๋ค.
axios๊ฐ 422๋ฅผ ๊ฑฐ๋ถํ์ง ์๊ณ ํด๊ฒฐํ๋๋ก ํ๋ ์ํฉ์ด ์์ต๋๊น? ๋ค๋ฅธ ์ ๋ณด๊ฐ ํ์ํ๋ฉด ์๋ ค์ฃผ์ญ์์ค.
๋์ ์ฃผ์ ์ ๊ฐ์ฌํฉ๋๋ค!
ํ์ธํ์ต๋๋ค. redux-saga
์ ํจ๊ป axios๋ฅผ ์ฌ์ฉํ ๋๋ ๋น์ทํ ๊ฒ์ ๋ณด๊ณ ์์ต๋๋ค. ์ฌ๊ธฐ์ ์ผ๋ถ 422๊ฐ๋ ๊ฑฐ๋ถ๋ ์ฝ์์ผ๋ก ์ฒ๋ฆฌ๋์ง ์์ต๋๋ค.
์ ๊ฒฝ ์ฐ์ง ๋ง์ธ์, ๋ด ๋ฌธ์ ๋ฅผ ์ฐพ์์ต๋๋ค. ์ธํฐ์ ํฐ๊ฐ ์ค๋ฅ๋ฅผ ์ฑ ๊ณ์ธต์ผ๋ก ์ ๋๋ก ์ ํํ์ง ์์์ต๋๋ค. d'oh! ๐ณ
์ด ๋ฌธ์ ๋ฅผ ์กฐ์ฌํ ๊ฒฐ๊ณผ ์ค์ ๋ก๋ ํธ์ถ ์คํ ์ด๋๊ฐ์ ์จ์ด ์๋ ๋ก์ปฌ ์ ํ ์ค๋ฅ๋ผ๋ ๊ฒ์ ์๊ฒ ๋์ด Axios์ ๋ฌธ์ ๊ฐ ์๋๋ผ ๋ก์ปฌ ๋ฌธ์ ๋ผ๊ณ ๋ฏฟ๊ฒ ๋์์ต๋๋ค.
์ ๋ฐ์ดํธ:
์ฝ๊ฐ์ ์กฐ์ฌ ํ์, ๋๋ ์ด๊ฒ์ ๋์ "์๋ต ๊ฑฐ๋ถ๋" ์ธํฐ์ ํฐ์ ๊ณ ์ ํ ์ ์์์ต๋๋ค.
์ธํฐ์ ํฐ ๋ด์์ ๋ค์๊ณผ ๊ฐ์ด ์ผ์ต๋๋ค.
return error
๋์ ๋ค์๊ณผ ๊ฐ์ด ์์ฑํ์ฌ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ์ต๋๋ค.
return Promise.reject(error);
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
์ด ๋ฌธ์ ๋ฅผ ์กฐ์ฌํ ๊ฒฐ๊ณผ ์ค์ ๋ก๋ ํธ์ถ ์คํ ์ด๋๊ฐ์ ์จ์ด ์๋ ๋ก์ปฌ ์ ํ ์ค๋ฅ๋ผ๋ ๊ฒ์ ์๊ฒ ๋์ด Axios์ ๋ฌธ์ ๊ฐ ์๋๋ผ ๋ก์ปฌ ๋ฌธ์ ๋ผ๊ณ ๋ฏฟ๊ฒ ๋์์ต๋๋ค.
์ ๋ฐ์ดํธ:
์ฝ๊ฐ์ ์กฐ์ฌ ํ์, ๋๋ ์ด๊ฒ์ ๋์ "์๋ต ๊ฑฐ๋ถ๋" ์ธํฐ์ ํฐ์ ๊ณ ์ ํ ์ ์์์ต๋๋ค.
์ธํฐ์ ํฐ ๋ด์์ ๋ค์๊ณผ ๊ฐ์ด ์ผ์ต๋๋ค.
๋์ ๋ค์๊ณผ ๊ฐ์ด ์์ฑํ์ฌ ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ์ต๋๋ค.