# request
Axios를 사용하여 HTTP 요청을 보내고 원하는 데이터를 서버에 전달하는 방법은 다음과 같다.
1. axios.post() 메소드를 사용하여 HTTP POST 요청을 보낸다. 이때, 첫 번째 매개변수로 요청을 보낼 URL을 전달하고, 두 번째 매개변수로는 보낼 데이터를 전달한다.
axios.post('/api/data', {
key1: 'value1',
key2: 'value2'
})
2. HTTP POST 요청의 본문에 포함될 데이터는 두 번째 매개변수로 전달한다. 데이터는 객체 형태로 전달하며, 객체의 프로퍼티 이름이 데이터의 키(key)가 되고, 프로퍼티 값이 데이터의 값(value)이 된다.
3. 만약, 데이터를 JSON 형식으로 보내고 싶다면, Content-Type 헤더를 application/json으로 설정해야 한다. 이때, axios.post() 메소드의 세 번째 매개변수로 headers 객체를 전달한다.
axios.post('/api/data', {
key1: 'value1',
key2: 'value2'
}, {
headers: {
'Content-Type': 'application/json'
}
})
4. axios.post() 메소드는 Promise 객체를 반환한다. 이를 사용하여 서버의 응답을 처리한다.
axios.post('/api/data', {
key1: 'value1',
key2: 'value2'
}, {
headers: {
'Content-Type': 'application/json'
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
위 코드에서 then() 메소드는 서버에서 반환된 응답을 처리한다. catch() 메소드는 요청에 실패한 경우 에러를 처리한다.
이와 같은 방법으로 axios를 사용하여 HTTP POST 요청을 보내고, 원하는 데이터를 서버에 전달할 수 있다.
# response
1. axios를 사용하여 HTTP 요청 보내기: axios.get(), axios.post() 등의 메소드를 사용하여 서버로 HTTP 요청을 보낸다.
요청을 보내기 위해서는 요청할 URL을 지정해야 한다. 예를 들어, GET 요청을 보내는 경우 다음과 같이 작성할 수 있다.
axios.get('https://example.com/api/data')
2. HTTP 응답 받기: axios.get(), axios.post() 등의 메소드는 Promise 객체를 반환한다. 따라서, then() 메소드를 사용하여 서버로부터 받은 HTTP 응답을 처리할 수 있다. 예를 들어, 다음과 같이 작성할 수 있다.
axios.get('https://example.com/api/data')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
위 예제에서, then() 메소드는 서버로부터 받은 응답을 처리하기 위해 사용된다. 받은 응답을 콘솔에 출력하는 예제이다.
또한, catch() 메소드를 사용하여 요청에 실패한 경우 에러를 처리할 수 있다.
'코딩 > React' 카테고리의 다른 글
인증/인가(쿠키, 세션, 토큰, JWT) (0) | 2023.05.01 |
---|---|
throttling & debouncing (0) | 2023.05.01 |
React Query (0) | 2023.04.29 |
Custom Hooks (0) | 2023.04.29 |
Thunk 2 (0) | 2023.04.29 |
댓글