08_1 POST & GET 정리

1 POST & GET

1) GET

• 클라이언트에서 서버로 어떠한 리소스로 부터 정보를 요청하기 위해 사용되는 메서드
• GET 요청은 캐시가 가능함
• GET 요청은 브라우저 히스토리에 남음
• 요청에 길이 제한이 있음
• 데이터 요청 시에만 사용됨

2) POST

• 클라이언트에서 서버로 리소스를 생성하거나 업데이트하기 위해 데이터를 보낼 때 사용 되는 메서드
• 전송할 데이터를 HTTP 메시지 body 부분에 담아서 서버로 보냄
• 데이터를 전송할 때 길이 제한이 따로 없어 용량이 큰 데이터를 보낼 때 사용하거나 GET처럼 데이터가 외부적으로 드러나는건 아니라서 보안이 필요한 부분에 많이 사용

3) 차이점

• 사용목적 : GET은 서버의 리소스에서 데이터를 요청할 때, POST는 서버의 리소스를 새로 생성하거나 업데이트할 때 사용함
• 요청에 body 유무 : GET 은 URL 파라미터에 요청하는 데이터를 담아 보내기 때문에 HTTP 메시지에 body가 없음. POST 는 body 에 데이터를 담아 보내기 때문에 당연히 HTTP 메시지에 body가 존재함
• 멱등성 (idempotent) : GET 요청은 멱등

// 1. fetch : fetch(url, options) -> Promise의 형태

const result = [];

// fetch("https://jsonplaceholder.typicode.com/users")
// .then(response => response.json())
// .then(data => data.map(item => result.push(item.name))) 
// .catch(error => console.log(error))

// [{uer1}, {user2}]의 형식으로 저장되게 하기 위해 item.name을 push함
// console.log(result);


// 2. await

// const dataFetch = async() => {
//      	const response = await fetch("https://jsonplaceholder.typicode.com/users");
//      	const data = await response.json();
    
//      	//console.log(data);
//          return data
//     }

//     const dataResult = dataFetch();


// 3. axios -> fetch의 두개의 단계를 하나로 줄일 수 있음

axios.get("https://jsonplaceholder.typicode.com/users")
.then(data => console.log(data.data))

const dataFetch = async() => {
	const response = await axios.get("https://jsonplaceholder.typicode.com/users").data;

	return response;
}

const dataResult = dataFetch();

console.log(dataResult);