728x90
๋ฐ์ํ
2023.06.27 - [Front-End/Library] - Library] Axios
์ด์ Axios๊ธ์ ๊ธฐ๋ฐ์ผ๋ก ๋ง์ง๋ง ์ฝ๋ฉํธ์ ๋ฌ์๋ ๋ด์ฉ๋ค์ ๋ค๋ค๋ณด๋ ค๊ณ ํฉ๋๋ค.
๋์์์ฒญ
axios
.all([axios.get(), axios.get(), req3...])
.then(axios.spread((res1, res2, res3, res4) => {
// ์์ฒญ ์ฑ๊ณตํ์ ๋
})
)
ํ ๋ฒ์ ์ฌ๋ฌ ๊ฐ์ ๋ฐ์ดํฐ๋ฅผ ๊ฐ๊ณ ์ค๊ณ ์ถ์ ๋ ์ฌ์ฉํ๋ฉด ๋ ๋ฏํฉ๋๋ค.
Instance
const axiosInstance = () => {
const instance = axios.create({
baseURL: 'http://localhost:3000/account',
withCredentials: true,
xsrfCookieName: '์ฟ ํค์ด๋ฆ',
xsrfHeaderName: 'ํค๋์ด๋ฆ',
...
});
return instance;
};
axiosํต์ ์ ์ํ instanceํ๋ ๋ง๋ค์ด ๋ฏธ๋ฆฌ option์ ์ค์ ํด ์ฃผ๊ณ ์ฌ์ฉํ๋ฉด ํธ๋ฆฌํฉ๋๋ค.
์ ์ญ์ค์
axios.defaults.baseURL = 'http://localhost:3000/account';
axios.defaults.withCredentials = true;
axios.defaults.xsrfCookieName = '์ฟ ํค์ด๋ฆ';
axios.defaults.xsrfHeaderName = 'ํค๋์ด๋ฆ';
instance ๋ง๋ค๊ณ ๋ ๋ค, instance.defaults๋ก ๊ฐ์ ์ ํด์ฃผ๋ฉด default ๊ฐ์ ๋ฐ๊ฟ ์ค ์ ์์ต๋๋ค.
์ด๋ฏธ์ง ๋ค์ด๋ก๋
axios({
url: imgurl,
method: 'GET',
responseType: 'blob'
})
.then((response) => {
const url = URL.createObjectURL(new Blob([response.data])); // blob ๋ฐ์ดํฐ๋ฅผ ๊ฐ์ฒด url๋ก ๋ณํ
// ์ด๋ฏธ์ง ์๋ ๋ค์ด ๋ก์ง
const aTag = document.createElement('a');
aTag.setAttribute('href', url);
aTag.setAttribute('download', 'sample.png');
aTag.click();
URL.revokeObjectURL(url);
})
interceptors
request
axios.interceptors.request.use((config) => {
// ์์ฒญ์ด ์ ๋ฌ๋๊ธฐ ์ ์ ์์
์ํ
return config;
}, (error) => {
// ์์ฒญ ์ค๋ฅ๊ฐ ์๋ ์์
์ํ
return Promise.reject(error);
});
response
axios.interceptors.response.use((response) => {
// ์์ฒญ์ด ์ ๋ฌ๋๊ธฐ ์ ์ ์์
์ํ
return response;
}, (error) => {
// ์์ฒญ ์ค๋ฅ๊ฐ ์๋ ์์
์ํ
return Promise.reject(error);
});
Interceptor ์ ๊ฑฐ
const interceptor = axios.interceptors.request.use(() => {});
axios.interceptors.request.eject(interceptor);
๊ฐ๋ฐํ ๋, axios๊ด๋ จ๋ ๋ถ๋ถ์ ๋ฐ๋ก ์ ์ํด ๋๊ณ ํจ์๋ก ์ฌ์ฉํ๋ฉด ์ข ๋ ์์ค๋ฅผ ๊น๋ํ๊ฒ ์์ฑํ ์ ์์ ๊ฒ ๊ฐ์ต๋๋ค.
ํ๋ก์ ํธ ์งํ ํ ๋, ๋ค๋ฅธ ์ฌ๋์ด ์์ฑํด ๋์ ๊ฑฐ ๊ฐ์ ธ๋ค ์ฐ๊ธฐ๋ง ํ๋๋ฐ ์ ๋ฆฌํ ๊ฒธ ํ๋ฒ ๋ณด๋ ์ดํดํ๋๋ฐ ๋์์ด ๋์ต๋๋ค.
728x90
'Front-End > Library' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
Library] SWR : ์์ฉ_Mutate & Revalidation (0) | 2023.07.03 |
---|---|
Library] SWR : ์์ฉ (0) | 2023.07.03 |
Library] SWR (0) | 2023.07.03 |
Library] Swiper (0) | 2023.06.29 |
Library] Axios (0) | 2023.06.27 |