๋ฒ๊ทธ ์ค๋ช
ํน์ ์์ฒญ ๋งค๊ฐ๋ณ์๋ ์ธ์คํด์ค ๊ธฐ๋ณธ ๋งค๊ฐ๋ณ์์ ๋ณํฉ๋์ง ์์ต๋๋ค.
์ฌํํ๊ธฐ ์ํด
const instance = axios.create({
baseURL: "http://www.example.com",
params: {
q: "question",
}
});
instance.get("/page",
{
params: {
page: 2
}
}
)
์์ฒญ ๋งค๊ฐ๋ณ์ ๊ฐ์ฒด๊ฐ ์ธ์คํด์ค ๊ธฐ๋ณธ ๋งค๊ฐ๋ณ์ ๊ฐ์ฒด๋ฅผ ์ฌ์ ์ํ๋ค๋ ์ฌ์ค์ด ๋ฐ์ํฉ๋๋ค. ์ธ์คํด์ค์ ๋ ์ด์ q
์ฟผ๋ฆฌ ๋งค๊ฐ๋ณ์๊ฐ ์์ต๋๋ค.
์์๋๋ ํ๋
๋ฌธ์์ ๋ฐ๋ฅด๋ฉด ๋ชจ๋ ๊ตฌ์ฑ ์ต์ ์ด ๋ณํฉ ๋ฉ๋๋ค. https://github.com/axios/axios#instance - ๋ฐฉ๋ฒ
์์ฒญ์ q
๋ฐ page
๋งค๊ฐ๋ณ์๊ฐ ๋ชจ๋ ํฌํจ๋ ๊ฒ์ผ๋ก ์์ํ์ต๋๋ค. ์ด๊ฒ์ ๋ฒ์ 0.18.0์์ ์๋ํ๋ ๋ฐฉ์์ด๊ธฐ๋ ํฉ๋๋ค.
ํ๊ฒฝ:
๋ค์์ ์คํ ์ค์ธ ์์ ๋๋ค. https://runkit.com/philipbjorge/axios-regression
์ธ์ ๊ธฐ๋ฐ ์ธ์ฆ ํ ํฐ๋ ๋ณํฉ๋์ง ์๋ ์ ์ฌํ ๋ฌธ์ ๊ฐ ์์ต๋๋ค.
์์ ์ params
๋ฅผ ์์ฑ์ deepMergeProperties
์น์
์ผ๋ก ์ฎ๊ธฐ๋ ๊ฒ๋งํผ ๊ฐ๋จํฉ๋๋ค. ์ฐจ์ด์ : https://github.com/axios/axios/compare/8d0b92b2678d96770304dd767cd05a59d37f12cf...zackseuberling :zs-fix-merge-params
@zackseuberling ์ด์ ๋ํ ํ ๋ฆฌํ์คํธ๋ฅผ ์ ๋ ฅํ ์ ์์ต๋๊น?
๊ฐ์ ๋ฌธ์ ๊ฐ ์์ต๋๋ค.
@jasonsaayman ํ ์คํธ๊ฐ ์ด์ #2196์์ (์ฌ๋ฐ๋ฅธ ๋์์ด๋ผ๊ณ ๊ฐ์ ํ๊ธฐ ์ํด) ํต๊ณผํ๊ณ ์์ต๋๋ค.
๊ณง ์ถ์๋๊ธฐ๋ฅผ ๋ฐ๋๋๋ค. ๋ฌธ์ ๋ ๋๋ฅผ ๊ฝค ์ง์ฆ๋๊ฒ ๋ง๋ค์์ต๋๋ค.
๊ฐ์ ๋ฌธ์ ๊ฐ ์์ต๋๋ค. ์ธ์ ์์ ๋ ์์ ์ธ๊ฐ์?
@wphestiraid๋ ๋ง์ฐฌ๊ฐ์ง์ ๋๋ค ๐ฌ
0.18.1
๋ค์ด๊ทธ๋ ์ด๋ํ๋ฉด ํด๊ฒฐ ๋ฐฉ๋ฒ์ผ๋ก ํด๊ฒฐ๋์์ต๋๋ค! ๋ณด์ ์ทจ์ฝ์ ์ด ์์ ๋์์ต๋๋ค.
@serranoarevalo ์ ๋ 0.18.1
์ฌ์ฉํ ์ ์๋ค๊ณ ์๊ฐํฉ๋๋ค :smile:
๋ํ์ด ์ผ์ด๋ ๊ฒ์ผ๋ก ๋ณด์ธ๋ค method
๊ฐ ๋จ์ง์ ์ง์ ๋ ์๋ค๋ฉด, create
ํธ์ถ์ด ์๋๋ผ request
. ๊ทธ๊ฒ์ ์์๋ด๋ ๋ฐ ํ๋ฃจ ์ข
์ผ ๊ฑธ๋ ธ์ต๋๋ค. ํ์คํ ํ๊ธฐ์ ์ธ ๋ณํ์์ต๋๋ค. (์ด๊ฒ์ ๋ณ๋์ ๋ฌธ์ ์ฌ์ผ ํฉ๋๊น, ์๋๋ฉด ๋์ผํ ์ผ๋ฐ์ ์ธ ๋ฌธ์ ์ ์ผ๋ถ์
๋๊น?)
์ฌ๊ธฐ์๋ ๊ฐ์ ๋ฌธ์
์ด๊ฒ์ ๋ํ ์์์ด ์์ต๋๊น? ์ธ์ ๊ณ ์ณ์ง๊น?
์ด๊ฒ์ ๋ํ ์์์ด ์์ต๋๊น? ์ธ์ ๊ณ ์ณ์ง๊น?
๋น๋ถ๊ฐ v0.18.1
๋ฅผ ์ฌ์ฉํ์ญ์์ค. โ๏ธ
๊ทธ๊ฒ์ด ๋ด๊ฐ ์ฌ์ฉํ๊ณ ์๋ ๊ฒ์ด์ง๋ง ๋ณด์ ๋ฌธ์ ๋ก ์ธํด ์ด ๋ฌธ์ ๊ฐ ํด๊ฒฐ๋๋ฉด v0.19.0
๋ก ์
๊ทธ๋ ์ด๋ํด์ผ ํฉ๋๋ค.
๊ทธ๊ฒ์ด ๋ด๊ฐ ์ฌ์ฉํ๊ณ ์๋ ๊ฒ์ด์ง๋ง ๋ณด์ ๋ฌธ์ ๋ก ์ธํด ์ด ๋ฌธ์ ๊ฐ ํด๊ฒฐ๋๋ฉด
v0.19.0
๋ก ์ ๊ทธ๋ ์ด๋ํด์ผ ํฉ๋๋ค.
์ด๋ค ์ข
๋ฅ์ ๋ณด์ ๋ฌธ์ ? v0.18.0
์ ๋ณด์ ๋ฌธ์ ๊ฐ ์์์ง๋ง v0.18.1
๋ ๊ด์ฐฎ์ต๋๋ค.
NPM์ ์ฌ์ ํ โโ๊ฐ์ฌ ์ค์ 0.18.1์ ์ทจ์ฝํ ๊ฒ์ผ๋ก ํ์ํ๊ณ ์์ต๋๋ค(์ ์ฒญ์ด์ผ ๊ฐ๋ฅ์ฑ์ด ์์).
์ ์ฒ๋ผ axios 0.19
๋ฅผ ์ฌ์ฉํด์ผ ํ๋ ๊ฒฝ์ฐ ๋งค๊ฐ๋ณ์๋ฅผ ์ด์ ๊ฐ์ด ๊ด๋ฆฌํ ์ ์์ผ๋ฉฐ ํ์ฌ๋ก์๋ ํด๊ฒฐ ๋ฐฉ๋ฒ ์ผ๋ก ์ ์๋ํฉ๋๋ค.
// Pass to create only these params
const instance = axios.create({
headers,
baseURL,
timeout,
});
// Pass others to the instance request
instance.request({
method,
url,
data,
...options,
});
์ ์ ์์ ์ ๊ธฐ๋ค๋ฆฌ๋ฉฐ ๐ญ
์ฐฌ์ฑ. ์ด ๋ฒ๊ทธ๋ฅผ ์ซ๋ ๋ฐ ์คํ๋ฅผ ๋ณด๋๊ณ ๋ฌธ์ ๋ฅผ ์์ฑํ๊ธฐ ์ํด ์ฌ๊ธฐ์ ์์ต๋๋ค.
์์ ์ฌํญ์ ์ ๊ณตํ๊ธฐ ์ํ ์งํ ์ํฉ์ด ์์ต๋๊น?
https://github.com/axios/axios/blob/v0.19.0/lib/core/mergeConfig.js#L18 -L22
module.exports = function mergeConfig(config1, config2) {
// eslint-disable-next-line no-param-reassign
config2 = config2 || {};
var config = {};
utils.forEach(['url', 'method', 'params', 'data'], function valueFromConfig2(prop) {
if (typeof config2[prop] !== 'undefined') {
config[prop] = config2[prop];
}
});
v0.19.0 ์ฝ๋๋ mergeConfig(axios_instance.defaults, config)
์์ฒญ config.params๋ง ์ฌ์ฉ๋ฉ๋๋ค.
๋ถ ๋ฒ์ ์ด ์ด์ ๋ฒ์ ๊ณผ ํธํ๋์ง ์๋ ์ด์ ๋ ๋ฌด์์
๋๊น?
์ด๊ฒ์ ๋ํ ํ
์คํธ๊ฐ ์์ต๋๊น?
๋ฌผ์ด๋ด์ผ ํด์.
@magicdawn ์ ์๊ฐ์๋ ๊ทธ๋ค์ด ๋ง์น ๊ฒ ๊ฐ์ต๋๋ค. ๋๋ ๊ทธ๋ค์ด ์์ ์ฌํญ์ ๋ณํฉํ๊ธฐ ์ํด ๋ฌด์์ ๊ธฐ๋ค๋ฆฌ๊ณ ์๋์ง ์ดํดํ์ง ๋ชปํฉ๋๋ค. @emilyemorehouse ํด์ฃผ์ธ์ https://github.com/axios/axios/pull/2196 ๐!
์์์ด ์๋์? ๋์ผํ ์ค๋ฅ๊ฐ ๋ฐ์ํ์ฌ ์ต์ ๋ฒ์ ์ผ๋ก ์ ๊ทธ๋ ์ด๋ํ์ต๋๋ค.
๋ฌธ์ ๋ ์ด๊ฒ์ด ๊ณง ํด๊ฒฐ๋๋ค๋ ๊ฒ์ ๋๋ค!!
์ด ๋ฌธ์ ๋ฅผ ์ฐพ๋ ๋ฐ ์๊ฐ์ด ์ข ๊ฑธ๋ ธ์ต๋๋ค... ์ง์ฆ๋๋ค์. ์์ ๋ ๊ธฐ๋ค๋ฆฌ๊ณ ์์ต๋๋ค.
ํดํน์ผ ์ ์์ง๋ง ์์ฑ๋ axios ์ธ์คํด์ค์ ๋ํด get ๋ฉ์๋๋ฅผ ํจ์นํ ์๋ ์์ต๋๋ค.
const client = axios.create({
baseURL: YOUR_URL,
})
client.originalGet = client.get
client.get = (url, { params, ...config }) =>
client.originalGet(url, {
...config,
params: {
key: YOUR_API_KEY,
...params,
},
})
// use it like normal
client.get('/something', { params: paramsToMerge } )
์ธ์คํด์ค ์์ฑ์ ๋ํํ๊ณ ๋ค์๊ณผ ๊ฐ์ด ๋ชจ๋ ๋ฉ์๋๋ฅผ ํจ์นํ์ต๋๋ค.
export const createInstance = (config?: AxiosRequestConfig): AxiosInstance => {
const instance = axios.create(config);
// Patch methods to merge default params into each request.
// https://github.com/axios/axios/issues/2190
for (const [method, configIndex] of methodsToPatch as Array<[keyof AxiosInstance, number]>) {
const orig = instance[method] as Function;
// @ts-ignore
instance[method] = (...args: any[]) => {
if (!args[configIndex]) {
args[configIndex] = {};
}
args[configIndex].params = {
...(instance.defaults.params || {}),
...(args[configIndex].params || {}),
};
return orig.apply(instance, args);
};
}
return instance;
};
const methodsToPatch = [
['getUri', 0],
['request', 0],
['get', 1],
['delete', 1],
['head', 1],
['post', 2],
['put', 2],
['patch', 2],
];
ํด๊ฒฐ ๋ฐฉ๋ฒ์ ์ฐพ๋ ๋ชจ๋ ์ฌ๋์ ์ํด ๋ด ๊ฒ์ ์ฌ์ฉํ ์ ์์ต๋๋ค(๋ชจ๋ ์ฌ๋์๊ฒ ์ ์ฉ๋์ง ์์ ์ ์์).
npm i qs
axios.interceptors.request.use(config => {
config.paramsSerializer = params => qs.stringify({ ...params, myValue: 'foo' });
return config;
}
@janpantel ๊ถ๊ธํ๋ฐ ๋งค๊ฐ๋ณ์๋ง ์์ ํ๋ฉด ๋์ง ์๋์?
axios.interceptors.request.use(config => {
config.params.myValue = 'foo';
return config;
}
@janpantel ๋๋ถ์ ๊ทธ๋ ๊ฒ ์๋ํ๋ค๊ณ ์๊ฐํ๊ณ ๋ค๋ฅธ ๋์๋ณด๋ค ๊นจ๋ํฉ๋๋ค.
์ฐ๋ฆฌ๋ ๋งค์ฐ ์ ์ฌํ ์ค๋ฅ๊ฐ ์์ต๋๋ค.
์ฌ์ค axios.create()
params
์ธ์คํด์ค๋ฅผ ์ง์ ํ ์๋ ์์ต๋๋ค.
๊ทธ ๋์ ์ฐ๋ฆฌ๋ ์์ฒญ ์ธํฐ์
ํฐ๋ก ๋์๊ฐ์ต๋๋ค ...
์ ์๊ฒ๋ ๋ง์ฐฌ๊ฐ์ง์ ๋๋ค. ์ค๋ ๋ ๋ฏธ์น๊ฒ ํด! ๋ชจ๋ ์ ์๋ํ์ต๋๋ค. ๊ทธ๋ฐ ๋ค์ ๊ฐ์๊ธฐ ์ธ์ฆ ๋ฌธ์ ์ CORS ๋ฌธ์ ๊ฐ ๋ฐ์ํ์ต๋๋ค! ์ผ...
๋๋ v18์์ v19๋ก ์ ๋ฐ์ดํธ ํ ๋ค์์ด ๋ฒ๊ทธ๋ฅผ ์์ ๋ฐ์๋ค๋ ๊ฒ์ ์์ ๋์ต๋๋ค. ์ธ์คํด์ค ์ ์์์ ์ ์ํ '๊ธฐ๋ณธ' ๋งค๊ฐ๋ณ์(๊ตฌ์ authkey ๋งค๊ฐ๋ณ์)๊ฐ ๋์ค์ ์ ๋งค๊ฐ๋ณ์๋ก ํด๋น ์ธ์คํด์ค๋ฅผ ํธ์ถํ์ ๋ ๋ณํฉ๋์ง ์์ ๊ฒ์ผ๋ก ๋ณด์ ๋๋ค. ์ ๋งค๊ฐ๋ณ์๋ ๊ธฐ๋ณธ๊ฐ์ ์ฃฝ์์ต๋๋ค.
๋ฒ์ 18๋ก ๋ค์ด ๊ทธ๋ ์ด๋ํ๋ฉด ํด๊ฒฐ๋์์ต๋๋ค. ๊ทธ๋ค์ด ๊ณง ์์ ํ๊ธฐ๋ฅผ ๋ฐ๋๋๋ค. ์ ๋ ๋ชจ๋ ๋ชจ๋์ด ์ต์ ์ํ์ธ ๊ฒ์ ์ข์ํฉ๋๋ค! :NS
์ด์ ๋
ธ๋ ๋ฐ ๋ธ๋ผ์ฐ์ ์์ umi-request๋ฅผ ์ฌ์ฉํ๋๋ก ์ค์ ํฉ๋๋ค.
์ฌํ๊น์ง๋ ๊ทธ๋ฐ๋๋ก ์๋๋ค. ๐
๊ฐ์ ๋ฌธ์ ๊ฐ 2020๋
์ดํ๋ก ์ฌ์ ํ ์ข
๋ฃ๋ฉ๋๋ค.
์ค๊ณ๋ ๋๋ก ์คํ๋ฉ๋๊น? ์๋๋ฉด ์ธ์ ์ด ๋ฌธ์ ๋ฅผ ํด๊ฒฐํ ์ ์์ต๋๊น?
Axios ๋ฒ์ : 0.19.0
์ ์ฉํ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ ๊ณตํด์ฃผ์ ์ ๊ฐ์ฌํฉ๋๋ค!
v0.19.1
์๋ ์ฌ์ ํ ์ด ๋ฒ๊ทธ๊ฐ ์์ต๋๋ค ๐
์ด ๋ฌธ์ ๋ฅผ ์ด๋ฏธ ์์ ํ์ญ์์ค. ์ด๊ฒ์ ์ ๋ง ์ง์ฆ๋ฉ๋๋ค. ์ด ๋ฒ๊ทธ๋ฅผ ํ์ ํ๋ ๋ฐ 15๋ถ์ด ๊ฑธ๋ ธ์ต๋๋ค.
[email protected]
์ฌ์ฉํ๋ ๊ฒ๊ณผ ๋์ผํ ๋ฌธ์ ์
๋๋ค. ์ธํฐ์
ํฐ๋ฅผ ํด๊ฒฐ ๋ฐฉ๋ฒ์ผ๋ก ์ฌ์ฉํฉ๋๋ค.
[email protected]์์ ์ฌ์ ํ ๋์ผํ ๋ฌธ์ ๊ฐ
npm ์ค์น --save [email protected]
์ด ๋ฌธ์ ๋ ์์ต๋๋ค. ๊ณ ์ณ์ฃผ์ธ์
์ผ์ข ์ ๋์๋ ๋๋ผ๋ง
์ธ์คํด์ค ๋งค๊ฐ๋ณ์๊ฐ ํธ์ถ ๋งค๊ฐ๋ณ์์ ๋ณํฉ๋์ง ์๋ ๊ฒ๋ ์๋๋๋ค. ์ธ์คํด์ค ๋งค๊ฐ๋ณ์๋ ์์ฒญ์ ๋ํ ๋งค๊ฐ๋ณ์์ ์ ํ ๋ค์ด๊ฐ์ง ์์ต๋๋ค. ์ธ์คํด์ค๋ฅผ ๋ง๋ค๊ณ params๋ฅผ ์ ์ํ๋ฉด get ์์ฒญ ์ค ํ๋์์ ์ฐพ์ ์ ์์ต๋๋ค.
๋ชจ๋ get ํธ์ถ์์ ๋งค๊ฐ๋ณ์๋ฅผ ์ ์ํ๋ ๊ฒ๋ณด๋ค ๋ค์ด๊ทธ๋ ์ด๋๊ฐ ๋ ์ฌ์ด ์ต์ ์ด์์ต๋๋ค.
์ด ๋ฌธ์ ๊ฐ ์ข
๋ฃ๋ ์ด์ ๋ ๋ฌด์์
๋๊น? @renestalder๊ฐ ์ธ๊ธํ๋ฏ์ด ๋ง์ง๋ง ๋ฒ์ ์์๋ create
๋ฉ์๋๋ฅผ ๋ค์ ๋ฌด์๋ฏธํ๊ฒ ๋ง๋๋ ๋ชจ๋ ์์ฒญ์ โโ์ธ์คํด์ค ๋งค๊ฐ๋ณ์๊ฐ ๋ํ๋์ง ์์ต๋๋ค.
#2656์ ์์ ๋์ด ์ข ๋ฃ๋์์ง๋ง ์์ง ๋ฒ์ ์ด ์์ต๋๋ค.
@cheelahim์ด ์ ์ํ ๊ฒ์ฒ๋ผ ์ธํฐ์ ํฐ๋ ํด๊ฒฐ ๋ฐฉ๋ฒ์ผ๋ก ์ฌ์ฉํ์ต๋๋ค.
axios.interceptors.request.use(config => {
config.params. = {
myValue1: 'foo',
myValue2: 'bar',
...config.params,
}
return config;
}
๊ทธ๋ฌ๋ ์ฌ์ ํ ์ด ๋ฒ๊ทธ๋ฅผ ์์ ํ๊ธฐ ์ํ ์ ๋ฒ์ ์ ๊ธฐ๋ค๋ฆฌ๊ณ ์์ต๋๋ค.
const params = {
name,
id,
pageIndex,
pageSize,
};
const url = `/api/poi/query`;
axios
// .get(url, params)
.get(url, {
params,
})
.then(json => {
// do something
})
.catch(err => console.log(`error`, err));
์! ๊ฑฐ์ 1๋ ํ!
๋ฒ๊ทธ๋ ์ฌ์ ํ ์กด์ฌํฉ๋๋ค! ๋ฏฟ์ ์ ์๋ค......
์์ ์ฌํญ์ #2656์ ๋ณํฉ๋์์ง๋ง ์์ง ์์ ๋์ง ์์ ๋ฒ์ ์ ๋๋ค.
๊ทธ๋ฅ 0.18.0์ผ๋ก ๋ค์ด๊ทธ๋ ์ด๋
ํ์๋ ์ด์ ๋ ๋ฌด์์ ๋๊น?
๋ถํํ๋ fetch
์ ์งํ ์ด๋ฒคํธ ๋๋ ์ทจ์ ์ง์์ด ํ์ํ ์ฆ์ ์ข
๋ฃ๋ฉ๋๋ค.
๋ฒ์ ์ ^0.18.1
๊ณ ์ ํ๊ธฐ๋ง ํ๋ฉด ๋ฉ๋๋ค.
@techouse ๊ฐ ๋์์ผ๋ก ์ด๋ํ๋ ๊ฒ์ด ๋ ๋์ ์๋ฃจ์ ์ ๋๋ค.
์ ๋ ํญ์ axios๋ฅผ ์ฌ์ฉํ๋ ๊ฒ์ ์ข์ํ์ต๋๋ค. ๊ทธ๋ฌ๋ ์ด ์์ ์ฌํญ์ด ์ค๋ซ๋์ ์กด์ฌํ์ผ๋ฉฐ ์๋ฌด๋ ์ด๋ฅผ ๋ฒ์ ์ ํ ๋นํ ์ ์๋ค๋ ์๊ฐ์ ๋๋ด์ผ ๋ฟ์ด๋ฏ๋ก ๊ณ์ ์งํํด์ผ ํฉ๋๋ค. ๋๋ ์ค์ ๋ก ์ ํ์ ๋ฐ์ ์ํค๊ณ ์ ํ๋ ๋๊ตฐ๊ฐ๋ฅผ ๊ด๋ฆฌํ๋๋ก ํ์ญ์์ค.
์กด ์๋ฒ ๋ฅด๊ธฐ๋
๊ธฐ์ ์ด์ฌ
[email protected]
์ํ. 802-323-4558 | ์จ. 802-323-4558 | www.legacyresearch.com http://www.legacyresearch.com
๋ณด๋ธ ์ฌ๋: Evgeny [email protected]
๋ณด๋ธ ๋ ์ง: 2020๋
4์ 23์ผ ๋ชฉ์์ผ ์ค์ 10:59:32
๋ฐ๋ ์ฌ๋: axios /
์ฐธ์กฐ: Jon Alberghini [email protected] ; ๋๊ธ [email protected]
์ ๋ชฉ: Re: [axios/axios] ์์ฒญ ๋งค๊ฐ๋ณ์๊ฐ ์ธ์คํด์ค ๋งค๊ฐ๋ณ์์ ๋ณํฉ๋์ง ์์ต๋๋ค(#2190).
@techouse https://github.com/techouse ๋์์ผ๋ก ์ด๋ํ๋ ๊ฒ์ด ๋ ๋์ ์๋ฃจ์ ์ ๋๋ค.
โ
๋น์ ์ด ๋๊ธ์ ๋ฌ์๊ธฐ ๋๋ฌธ์ ์ด๊ฒ์ ๋ฐ๋ ๊ฒ์
๋๋ค.
์ด ์ด๋ฉ์ผ์ ์ง์ ๋ต์ฅํ๊ฑฐ๋ GitHub https://github.com/axios/axios/issues/2190#issuecomment-618445756 ์์ ํ์ธํ๊ฑฐ๋ https://github.com/notifications/unsubscribe-auth/AF6OZWIPREAQP5OGY437X3ROBJVJANFSM4HRPA๋ฅผ ๊ตฌ๋
์ทจ์
์์ ์ฌํญ ์ด ๋ณํฉ๋์ด v0.20.0์์ ๋ฆด๋ฆฌ์ค๋ ์์ ์ด๊ธฐ ๋๋ฌธ์ ์ข ๋ฃ๋ ๊ฒ ๊ฐ์ต๋๋ค. ์ฌ๊ธฐ๋ฅผ ์ฐธ์กฐ
์ฌ๊ธฐ์๋ ๊ฐ์ ๋ฌธ์ ๊ฐ ์์ต๋๋ค. ๊ณง ์์ ๋๊ธฐ๋ฅผ ๋ฐ๋๋๋ค!
+1. ์ผ๋จ ๋ค์ด๊ทธ๋ ์ด๋. ์ผ์.
@khastation @raphaelbadawi @jonathanalberghini @techouse @AndyOGo
๋์:
@mahnunchik
๋ถํํ๋ fetch
๋ ์งํ ์ด๋ฒคํธ ๋๋ ์ทจ์ ์ง์์ด ํ์ํ ์ฆ์ ์ข
๋ฃ๋ฉ๋๋ค.
@AndyOGo https://javascript.info/fetch-progress ์ ๊ฐ์ด ๊ตฌํํ ์ ์์ต๋๋ค.
ํค ๋งค๊ฐ๋ณ์๋ฅผ ๋ถ๋ฆฌํ๊ธฐ ์ํด ์ผ๋ถ ๋ถํด๋ฅผ ์ฌ์ฉํ์ฌ ํ์ถ๊ตฌ๋ฅผ ์ฐพ์์ต๋๋ค. ์์ ์ฝ๋๋ ํ์คํ์ง๋ง ์ด๋ฏธ ๋ณํฉ์ด ์๋ฃ๋๊ณ 0.20.0์ด ์งํ ์ค์ด๋ฏ๋ก ์ ๋ง ์์ ํฉ๋๋ค. fetch() ๊ฒฝํ์ด ์๋๋ผ๋ Axios๋ ์ฌ์ ํ ๊ฐ ๊ธธ์ ๋๋ค. Axios์์๋ ์ผ๋ฐ์ ์ผ๋ก ์ํฉ์ด ๋งค์ฐ ๊ฐ๋จํฉ๋๋ค. ;-)
@mahnunchik ๊ฐ์ฌํฉ๋๋ค
๋ค์ด๋ก๋ ๋ฐ ์
๋ก๋ ์ ๋ํ ์งํ ์ด๋ฒคํธ ์ ๋ํด ์ด์ผ๊ธฐํ๊ณ ์์ง๋ง!
์ง๋ฌธ ๊ฐ์ฌํฉ๋๋ค @bdrtsky
์ฃผ๋ก ๋ค์๊ณผ ๊ฐ์ ์ด์ ๋ก:
fetch
๋ XMLHttpRequest
๋นํด ์ฌ๋ฌ ํ๊ท๋ฅผ ์ง์ ํฉ๋๋ค.์์ ์ฌํญ์ด ์ด๋ฏธ 0.20 ๋ฆด๋ฆฌ์ค์ ํ ๋น๋์ด ์๊ธฐ ๋๋ฌธ์ ์ข ๋ฃ๋์์ต๋๋ค. ์ฐ๋ฆฌ๋ ํ์ฌ 0.20์ ์ง์ ์์ ํ๊ท๋ฅผ ์์ ํ๊ณ ์์ ์ ์ธ Axios๋ฅผ ๋ค์ ์ถ์ํ๊ธฐ ์ํด ์์ ํ๊ณ ์์ต๋๋ค.
์ด๊ฒ์ ์งํ์ค์ธ ์์ ์ด๋ฉฐ ์ ๋ฐ์ดํธ๋ฅผ ์ํด 0.20 ํ๋ก์ ํธ๋ฅผ ํ์ธํ์ญ์์ค.
0.19.3 ํจ์น ๋ฒ์ ์ ๋ฃ์ด๋ ๋๋์? ๋์ผํ ๋ง์ด๋ ๋ฆด๋ฆฌ์ค์์ ์์ ๋์ง ์์ผ๋ฉด ๊ฒฐํจ์ ๋ซ์ ์ ์์ต๋๋ค ...
๋๋ ๋ค์ ์ด์์ง๋ง ์ฐ๋ฆฌ๋ 0.19.3์ ์ถ์ํ์ง ์์ ๊ฒ์ ๋๋ค. 0.18.0์์ 0.19.2๋ก์ ํ๊ท๋ฅผ ๋ชจ๋ ์ ๊ฑฐํ๋ 0.20 ๋ฆด๋ฆฌ์ค์์ ์์ ์ฑ์ ์ป๊ณ ์ถ์ต๋๋ค.
๊ฐ๋ฅํ ์ ์ผํ ํด๊ฒฐ์ฑ ์ ๋ค์ด๊ทธ๋ ์ด๋ํ๋ ๊ฒ์ ๋๋ค.
์ด ์ ๋งคํ 0.20 ๋ฆด๋ฆฌ์ค๋ฅผ ์ธ์ ๊ธฐ๋ํ ์ ์์ต๋๊น? ๊ทธ๋์ ์ฌ์ฉํ ์ ์๋ ๋ฒ ํ ๋ฒ์ ์ด ์์ต๋๊น?
@adamreisnz ์ ๋ 0.20 ๋ฆด๋ฆฌ์ค์์ ์์ ํ๊ณ ์์ง๋ง ์ฌ์ ํ ์ฝ 60๊ฐ์ ์ด์ํ pull ์์ฒญ์ด ์์ต๋๋ค(120๊ฐ์ ํ์์์ ๊ฐ์). ์ผ๋ถ๋ ์ด๋ฌํ pull ์์ฒญ์ด ์ฌ์ ํ ๊ด๋ จ์ด ์๋์ง ํ์ธํ๊ณ ํ์ธํ๋ ๋ฐ ๋งค์ฐ ์ค๋๋๊ณ ๋ค์ํ ์์ ์ด ์์ต๋๋ค. ์ฃผ์ ๋ณ๊ฒฝ ์ฌํญ์ ์ ์ํ์ง ์๊ณ , ํ ์คํธ๋ฅผ ํ๊ณ , ์ปดํ์ผ๋ ํ์ผ์ ํฌํจํ์ง ์๋ ๋ฑ์ ์์ ์ ๋ ธ๋์ ๋๋ค. ๊ธฐ๊ปํด์ผ 7์๊น์ง ์ฌ์ ์ถ์๋ ์ ์๋๋ก ๋ ธ๋ ฅํ๊ณ ์์ต๋๋ค. v1์์ ์์ ํ๊ธฐ ์ ์ ๋ฐ๋ก ์ป์ ์ ์๊ธฐ๋ฅผ ์ํ๋ฏ๋ก ์ด ๋ฆด๋ฆฌ์ค๋ฅผ ํ ์คํธํ๋ ๋ฐ ๋์์ด ๋์์ผ๋ฉด ํฉ๋๋ค.
์ฑ๊ฐ์ ๋ฌธ์ ์ ๋๋ค. ํด๊ฒฐ๋ ์ ์๊ธฐ๋ฅผ ๋ฐ๋ผ๋ฉฐ ์ค๋ซ๋์ ์ ์ง๋ฉ๋๋ค.
v1 ์์ ์ ํ๊ธฐ ์ ์ ๋ฐ๋ก ํ์ธํ๊ณ ์ถ์ต๋๋ค.
0.x
์๋ 1.0.0
์ด์ ์ ์ถ๊ฐ ๋ฆด๋ฆฌ์ค๋ฅผ ๋ง๋ค ์ ์๋ ์ถฉ๋ถํ ๊ณต๊ฐ์ด ์์ต๋๋ค. ๋ค์ ๋ฆด๋ฆฌ์ค์ ๋ชจ๋ ๊ฒ์ ์ง์ด๋ฃ์ ํ์๋ ์์ต๋๋ค. ์ฌ์ค, ์ ์ฌ์ ์ธ ์๋ก์ด ๋ฒ๊ทธ๋ฅผ ์ถ์ ํ๊ธฐ๊ฐ ๋ ์ด๋ ค์์ง ๊ฒ์ด๋ผ๊ณ ์ฃผ์ฅํ ์ ์์ต๋๋ค.
@markcarver ๋ฌผ๋ก ๊ฐ๋ฅํ์ง๋ง Axios๋ ํ์ฌ v1์ด ์๋ ์ํํ์ผ๋ก ๊ฐ์ฃผ๋ฉ๋๋ค. ๋๋ถ๋ถ์ ์ฌ๋๋ค์ Axios๊ฐ ๊ณต๊ฐ API๋ฅผ ์ถ์ํ์ง ์์ ๊ฒ์ผ๋ก ๋ณด์ ๋๋ค . v0.20.0์์๋ ์์ ์ฑ์ ๊ฐ์ ธ์ค๊ณ 0.19.x ๋ถ๊ธฐ์์ ๋ฐ์ํ๋ ๋๋ถ๋ถ์ ํ๊ท๋ฅผ ์์ ํ๊ณ ์ถ์ต๋๋ค. ์ด ๋ถ๊ธฐ์ ๋ช ๊ฐ์ง ๋ฌธ์ ๊ฐ ์์ ๋ฟ๋ง ์๋๋ผ ์ฝ๊ฒ ์น๋ฆฌํ ์ ์๋ ์ค๋ฅ์ ๋ํ ์์ ์ ๋๋ค.
๋ํ ๋์์ pull ์์ฒญ์ ๋ฐฑ๋ก๊ทธ๋ฅผ ์ง์์ผ ํฉ๋๋ค. ๊ทธ ์ค ์ผ๋ถ๋ 2017๋ ๋ถํฐ ์์๋ 120๊ฐ์ ์ด์ํ ํ ๋ฆฌํ์คํธ๋ฅผ ์ฒ๋ฆฌํ๋ ๊ฒ์ ๋งค์ฐ ์ด๋ ต์ต๋๋ค. ๋๋ ์ฐ๋ฆฌ๊ฐ ์ด ๋ฌธ์ ์ ๋๋ฌํ ๊ฒ์ด๋ผ๊ณ ์ฝ์ํฉ๋๋ค. ์ ๋ ์๋ฌด๋ฐ๋ ๊ฐ์ง ์๊ณ ๊ฐ๋ฅํ ํ Axios๋ฅผ ์ง์ํ๊ณ ์์ ํ ๊ฒ์ ๋๋ค.
๊ฐ์ฌ ํด์
์ฐ๋ฆฌ๊ฐ v0.18์์ Axios๋ฅผ ๋ค์ด๊ทธ๋ ์ด๋ํ๊ณ ์ ๊ทธ๊ฑฐ๋ ์์ฒด(์ ์ง๋ณด์๋์ง ์์) ๋ฒ์ ์ ๋กค๋งํ๊ณ ์์ ์ฌํญ์ ์ ์ฉํ์ง ์๋ ํ ํน์ ํ๋ฌ๊ทธ์ธ(์: axios ์บ์ ์ด๋ํฐ)์ ์ฌ์ฉํ ์ ์๊ธฐ ๋๋ฌธ์ ์ข์ ๊ฐ์ด ๋ง์ด ์์ด๋ ๊ฒ ๊ฐ์์. .
์ด๊ฒ์ ๊ฝค ๋ช ๋ฌ ๋์ ์ฌ์ค์ด์๊ณ ๋ชจ๋ ์ฌ๋๋ค์ด ์ต์ํ ๋ช ๊ฐ์ง ์์ ์ฌํญ์ด ๋ฆด๋ฆฌ์ค๋๊ธฐ๋ฅผ ์ด๋งํ๊ณ ์๋ค๊ณ ์๊ฐํฉ๋๋ค.
์ต์ํ ์ต์ ์ฝ๋๋ฒ ์ด์ค๋ฅผ ์ฌ์ฉํ ์ ์๋๋ก ํ์ฌ ์ ์ฉ๋ ์์ ์ฌํญ ์ค ์ผ๋ถ๋ฅผ ์ด์ํ๊ณ 0.19.x๋ฅผ ๋ฆด๋ฆฌ์คํ ์ ์์ต๋๊น? ๋ ๋ค๋ฅธ 120๊ฐ์ ํ ๋ฆฌํ์คํธ๋ฅผ ์งํํ ์์ ์ด๋ผ๋ฉด 0.20 ๋๋ v1์ด ๋์ฌ ๋๊น์ง ์ค๋ ์๊ฐ์ ๊ธฐ๋ค๋ ค์ผ ํ ๊ฒ ๊ฐ์ต๋๋ค.
๊ฐ๋ฅํ๋ฉด ๊ฐ์ธ์ ์ผ๋ก ๋ ์ ์ง์ ์ธ ์ ๊ทผ ๋ฐฉ์์ ์ ํํฉ๋๋ค.
@adamreisnz ๋๋ ์ฆ๋ถ์ ์ ํํ ๊ฒ์ด๋ผ๊ณ ํ์ ํ์ง๋ง 0.18.x์์ 0.19.x๋ก ๋ง์ ๋ถ๋ถ์ด ๊นจ์ก๊ณ ์์ด๋์ด๋ 0.20.0 ๋ฆด๋ฆฌ์ค๋ฅผ ๊ทธ ๋ฆด๋ฆฌ์ค์์ ๊ฐ์ฅ ์๊ธํ ๊ฒ๋ค๋ก ์์ ๋๊ฒ ๋ง๋๋ ๊ฒ์ด ์์ต๋๋ค. 60๊ฐ์ ํ ๋ฆฌํ์คํธ๋ง ๋จ์๊ณ ๋๋จธ์ง๋ ์ด๋ฏธ ์ฒ๋ฆฌํ๊ณ ๊ทธ 60๊ฐ ์ค ์ผ๋ถ๋ wip
๋๋ v1
ํ๊ทธ๊ฐ ์ง์ ๋์์ต๋๋ค.
์ค๋ ์๊ฐ์ด ๊ฑธ๋ ธ๋ค๋ ๊ฒ์ ์๊ณ ์์ง๋ง ์ด๋ฒ ๊ธฐํ์ ๋ฐ๋ก์ก์ ๋ ๋ง์ ์ผ์ ์ผ์ผํค๊ณ ๊นจ๋จ๋ฆฌ๋ ๊ฒ์ด ์๋๋ผ ์ด ์์ ์์ ๋์ฒด๋ก ๊ฐ๋ฅํ ์ผ์ ํ๊ณ ์ถ์ต๋๋ค. ๋ํ ๋น๋๋ ๊ณต๊ฐ๋๊ธฐ ์ ์ ๊ด๋ฒ์ํ ํ ์คํธ๊ฐ ํ์ํฉ๋๋ค. ์ข์ ๊ฐ์ ๋๋ผ๊ธด ํ์ง๋ง ์์ ์ ์ด์ง ์๊ณ ์๋ง์ ํ๊ท๋ฅผ ์์ ํ์ง ์์ผ๋ฉด ์ฆ๋ถ ์์ ๊ด๊ณ์์ด ๋ฆด๋ฆฌ์คํ ์ ์์ผ๋ฉฐ ์ฌ์ ํ 200~๊ฐ ์ด์์ ๋ฌธ์ ์ 60~๊ฐ์ ํ ๋ฆฌํ์คํธ๊ฐ ๋จ์ ์์ต๋๋ค. ์ฌ์ ํ ๋งค์ฐ ๋ถ์์ง Axios, ์ด์ฉ๋ฉด ํจ์ฌ ๋ ๋ถ์์ง ์๋ ์์ต๋๋ค.
๋ํ ์ ๋ ํ์ฌ ๋ฆด๋ฆฌ์ค๋ฅผ ์ ์ดํ์ง ์์ผ๋ฉฐ ์ง์์ ์์ํ์ ๋ ํ๊ท ๋ฐ ๊ฐ์ฅ ์๊ธํ ๋ฌธ์ ๋ฅผ ์์ ํ๊ณ ์ด์ ์ ์๋ํ๋ ๋ค๋ฅธ ๊ฒ์ ์์์ํค์ง ์๋ ๋น๋๋ฅผ ํจ๊ป ๋ง๋ค๊ฒ ๋ค๊ณ ์ฝ์ํ์ต๋๋ค. ๋๋ ์ด๊ฒ์ ๊ฝค ์ง์งํ๊ฒ ๋ฐ์๋ค์ด๊ณ ๊ทธ๋ ๊ฒ ํ๊ณ ์ถ๋ค.
๊ทธ๋ฌ๋ ๋์์ด ๋๋ ๊ฒฝ์ฐ ๋ณด์ ๋ฌธ์ ๋ฑ์ด ์์ ๋ 0.18.x ๋ฆด๋ฆฌ์ค๋ฅผ ์๋ํ๊ณ ์ป์ ์ ์์ต๋๊น?
๊ทธ๋ฌ๋ ๋์์ด ๋๋ ๊ฒฝ์ฐ ๋ณด์ ๋ฌธ์ ๋ฑ์ด ์์ ๋ 0.18.x ๋ฆด๋ฆฌ์ค๋ฅผ ์๋ํ๊ณ ์ป์ ์ ์์ต๋๊น?
์ ๋ง ๋๋จํฉ๋๋ค.
์ถ์ : ๋ง์ ์น ํ๋ก์ ํธ์ ๋ณต์กํ ํจํค์ง๋ฅผ ์ ์ง ๊ด๋ฆฌํ์ฌ ๊ทํ๊ฐ ํ๊ณ ์๋ ๋ ธ๊ณ ์ ๊ฐ์ฌ๋๋ฆฝ๋๋ค. ๐
๊ทธ๋ฌ๋ ๋์์ด ๋๋ ๊ฒฝ์ฐ ๋ณด์ ๋ฌธ์ ๋ฑ์ด ์์ ๋ 0.18.x ๋ฆด๋ฆฌ์ค๋ฅผ ์๋ํ๊ณ ์ป์ ์ ์์ต๋๊น?
์, ๋์ํฉ๋๋ค. ํ์คํ ๊ฐ์ฌํ๊ฒ ์ต๋๋ค.
์๋ก์ด ํญ๋ชฉ์ ํ ์คํธํ๋ ๋ฐ ๋์์ด ํ์ํ๋ฉด ๊ธฐ๊บผ์ด ๊ทธ๋ ๊ฒ ํ๊ฒ ๋ค๊ณ ์๋ ค์ฃผ์ธ์.
@adamreisnz ์ด ๋ถ๊ธฐ๋ฅผ ํ ์คํธํ ์ ์์ต๋๊น: 0.20.0-beta.1
์, ์ด๋ฒ ์ฃผ๋ง์ ์ฐ๋ฆฌ ํ๋ก์ ํธ ์ค ํ๋๋ฅผ ์ํด ํด๋น ์ง์ ์ผ๋ก ์ ํํ๋ ค๊ณ ํฉ๋๋ค.
@jasonsaayman ์ง๊ธ๊น์ง ๋๋ฌด ์ข์์ด, 0.20.0์ด ์ ์๋ํ๋ ๊ฒ ๊ฐ๋ค ๐
์ด์ ๋ฌธ์ ๋ฅผ ์ข ๋ฃํ ์ ์์ต๋๋ค.
์ด์ ์ ๋ฆด๋ฆฌ์ค์์ ์ ๋๋ก ์๋ํ๋ค๋ ํผ๋๋ฐฑ์ ๋ฐ์ ํ ์ข ๋ฃํฉ๋๋ค.
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
์ ์ ์์ ์ ๊ธฐ๋ค๋ฆฌ๋ฉฐ ๐ญ