๋ฐฑ์๋ ๊ฐ๋ฐ์๋: ํด๋น api ์
๋ฐ์ดํธํ์ต๋๋ค.
๋ฉ์๋๋ get์ด๊ณ body์ ๋ด์์ ๋ณด๋ด์ฃผ์๋ฉด ๋ฉ๋๋ค~
๋: ๋ต~~
<!--- ์ฝ๋ ์์ฑ ์ฐ๋ค๋ค๋ค๋ค๋คใ ๋ค๋ซ ----->
๊ฒฐ๊ณผ : ERROR ERROR
์?? ๐ ??
์ฌ์ง์ด Redux๋ก ์์ฑํ api instance์์๋ body๋ฅผ ๋ด๋๊ฑธ ๊ฑฐ๋ถ ใ .. ํ๋ผ๋ฏธํฐ๊ฐ url, config ์ด์์ผ๋ก ๋ชป ๋ฐ๋๋ค๊ณ ๋ฑ์ด๋.
์๋์ด๊ฐ๋ฐ์๋: get ์์ฒญํ๋๋ฐ ๋ฐ๋์ ๋ด๋๋ค๊ณ ??๐
๋: ๋ต- ์ ์ ๊ทธ๋ ๊ฒ ํ๋๋ฐ์?๐ณ? ์ ๋๋์?
์ด์ ์๋ ๊ฒ์ํ์์ ๊ฒ์ํ ๋ get ๋ฉ์๋๋ก ์์ฒญํ๋ฉฐ ๋ฐ๋์ ๋ด์์ ๋ณด๋ธ ๊ธฐ์ต์ด ์๊ธฐ์ - ๋น์ฐํ๊ฒ~~~~ body์ ๋ด๋๊ฑฐ ์คํค๋ํค์! ํ๋ ์ํฉ. ํผ๋๋ง ๊ฐ์ค๋๋ ์ํฉ ๊ทธ๋์ ์ ๋ฆฌํ๋ค.
์ผ๋จ ๊ฒฐ๋ก ๋ง ๋ณด์๋ฉด,
pararms ๋ฅผ ์จ์ ์์ฒญํ๋ฉด config์ ๋ด๊ฒจ์ get ์์ฒญ์์๋ ๋ฐ๋์ ๋ด์์ ๋ณด๋ด๋ ๊ฒ ์ฒ๋ผ ๋ณด๋ผ ์ ์๋ค.
ํ์ง๋ง ์ผ๋จ, ๊ทธ ๋ชจ์์๊ฐ ๊ฒฐ๊ตญ์๋ ์ฟผ๋ฆฌ ์คํธ๋ง์ผ๋ก ๋ ์๊ฐ๋ค. ๊ทธ๋์ ์ ํํ๊ฒ๋ ๋ฐ๋์ ๋ด์์ ๋ณด๋ผ ์๋ ์์ง๋ง ๊ทธ ํํ๊ฐ ๊ทธ ํํ๊ฐ ์๋๋ผ๋ ๊ฒ์ด๋ค.
ํธ์ถํ api network payload์ ๋ณด๋ฉด Query String Parameters๋ผ๊ณ ๋์ด์์ ๊ฒ์ด๋ค.
๊ทธ๋ฆฌ๊ณ url ๋ค์ ์ฃผ๋ ์ฃผ๋ - ์ด์ด์ ธ์ ๋ ์๊ฐ์ ๊ฒ์ด๋ค.
๋ฌผ๋ก , ๋ฐฑ์๋ ๊ฐ๋ฐ์๋์ด ์ด๊ฑธ ์ํ์ ๊ฑฐ๋ผ๋ฉด ํด๊ฒฐ๋ ๋ฌธ์ ๊ฒ ์ง๋ง ๊ฐ๋ฐ์๋์ด ์ํ์๋ ๊ทธ๋ฆผ์ด ์๋์ จ์.
Axios method ์ ๋ฆฌ
์ฌ์ค aixos ๊ณต์๋ฌธ์์ ์ ํ์๋ ์ง์๋๋ ๋ชจ๋ ์์ฒญ ๋ฉ์๋ ๋ณ์นญ๋ง ๋ด๋ get ์์๋ data๊ฐ ์๋ค.
์๋๋ axios ๊ณต์ ๋ฌธ์์์ ๋ฐ์ทํด์จ ๊ฒ์ด๋ค.
๋ณด๋ฉด get() ์์ data๊ฐ ์๋ค. ใ
post / put / patch ์์ฒญ์์๋ ๋ฐ๋์ ๋ฐ์ดํฐ๋ฅผ ๋ด์์ ๋ณด๋ผ ์ ์๋ค.
ํท๊ฐ๋ฆฌ์ง๋ง์ get์ ๋ฐ๋์ ๋ด์์ ์์ฒญํ ์ ์๋ค. ์ค์ง header์ ์ถ๊ฐํด์ ์๋ฒ์ ์ ์กํ๋ค.
GET ์์ฒญ์ ์๋ฒ์์ ๋ฆฌ์์ค๋ฅผ ๊ฐ์ ธ์ค๊ธฐ ์ํด ์ฌ์ฉํ๋ฉฐ ๋ณดํต ์ฟผ๋ฆฌ ๋งค๊ฐ๋ณ์๋ฅผ ์ฌ์ฉํด์ ์์ฒญ์ ์ธ๋ถ์ ์ผ๋ก ์ง์ ํ๋ค.
๊ทธ๋์ get์์ฒญ์ ์ฟผ๋ฆฌ๋ฅผ ์ฌ์ฉํด์ผํ๋ค.
params ์ด์ฉ๋ฐฉ๋ฒ
axios({
method: 'get',
url: 'http:// - ',
params: {
"key":value
}
},)
.then((Response)=>{
console.log(Response.data);
}).catch((Error)=>{
console.log(Error);
})
}
์๋, api ํธ์ถ์ ์ ๋ง ๋ฐฅ๋จน๋ฏ์ด ์ฝ๋๋ฅผ ์ฐ๋๋ฐ ์ด ๊ธฐ๋ณธ์ ์ธ๊ฒ๋ ์ ๋๋ก ๊ธฐ์ตํ๊ณ ์์ง ๋ชปํด์ ์ด๋ฒ๋ฒ๋ฒํ๋ค๋ ์ฌ์ค์ด ๋๋๊ณ ๋ถ๋๋ฝ๊ธฐ ์ง์ด ์์๋ค. ๋น๋นํ๊ฒ params๋ก ๋ณด๋ด์ง์์์!! ์ด๋ฌ๊ณ ์ ๊ทธ๋ฐ๋ฐ ~ ์ ์๋ฌ๊ฐ ๋๋๊ฑฐ์ง?!? ์ด๋ฌ๋ค๋ ๊ฒ ...ใ ..... ํ๋ผ๋ฏธํฐ๊ฐ ์ฟผ๋ฆฌ ์คํธ๋ง์ผ๋ก ๋ ์๊ฐ๋ค๋๊ฑธ ์ ๋๋ก ์ธ์ง ๋ชปํ๊ณ ์์๋ค๋ ์ . ์ด ๋ถ๋ถ์ ๋ค๋ฅธ ์ฌ๋์๊ฒ ์ ๋๋ก ์ค๋ช ํ์ง ๋ชป ํ๋ค๋ ์ ์ด ์ฐฝํผ์ค๋ฌ์ ๋ค๊ณ ๋ ํ ๊น...๐คฆ๐ปโ๏ธ