너무 매력적입니다.
가져오기 요청은 서버에서 정보를 요청하고 웹 페이지에서 해당 정보를 로드하거나 조작하는 데 사용됩니다. 할 수 있는 요청 유형은 다음과 같습니다.
이 블로그에서는 가장 일반적인 GET, POST, PATCH, PUT, DELETE에 초점을 맞출 것입니다. 생성, 읽기, 업데이트 및 삭제와 같은 CRUD 작업이라고도 합니다.
가져 오기
GET 요청 또는 읽기는 기본 요청입니다. 가져오기를 수행할 때 다른 모든 요청 방법을 지정해야 합니다. GET 요청의 예로는 즐겨찾는 웹 페이지를 로드하거나 스포츠 데이터를 검색하는 것과 같은 것이 있습니다. JavaScript에서 구문은 다음과 같습니다.
fetch(“http://localhost:9000”)
.then(response => response.json())
.then(data => console.log(data)
가져오기 요청은 비동기식입니다. 요청에서 받은 응답은 요청된 정보를 가져와서 클라이언트에게 다시 보내겠다는 약속입니다. 웹에서 정보를 더 쉽게 보낼 수 있도록 문자열로 전송됩니다. 해당 정보가 클라이언트로 다시 전송되면 또 다른 약속인 .json()을 호출하여 해당 문자열을 사용할 수 있는 Javascript 객체로 바꿉니다.
포스트/풋
POST 요청 또는 생성은 일반적으로 서버에 정보를 제출하는 데 사용됩니다. 예를 들어 제출 버튼이 있거나 새 웹사이트에 가입할 때 데이터베이스에 계정 정보를 추가하는 것이 있습니다. POST/PUT은 일반 GET 요청이 아니며 전달되는 정보가 조금 더 필요합니다. 필요한 요청 유형을 알려주는 메소드 매개변수가 필요합니다. 사용 중인 정보 유형을 나타내는 헤더 매개변수와 추가하려는 정보를 보유하는 본문 매개변수. 마지막으로 본문 정보를 웹을 통해 정보를 보내기 위해 문자열로 변환해야 합니다. 이를 위해 json 객체를 문자열로 변환하는 JSON.stringify()라는 도구를 사용합니다.
fetch(“http://localhost:9000”, {
Method: ‘POST’
Headers: {
‘Content-Type’: ‘application/json’,
},
Body: JSON.stringify(data),
})
.then(response => response.json())
.then(data => console.log(data)
POST 대신 PUT을 사용할 수도 있으며 둘 다 동일한 작업을 수행합니다. 주요 차이점은 PUT 요청은 멱등적이라는 것입니다. 즉, 서버를 동일한 상태로 유지하면서 동일한 요청을 한 번 또는 여러 번 연속으로 수행할 수 있습니다. 즉, PUT은 중복을 로드하지 않습니다.
반점
PATCH 요청 또는 업데이트는 API의 특정 정보를 업데이트하거나 수정하는 데 사용됩니다. 개인 정보를 편집하거나 업데이트하는 것이 그 예입니다. 이 메서드는 POST 요청과 유사하게 작성됩니다.
fetch(“http://localhost:9000” + id, {
Method: ‘PATCH’
Headers: {
‘Content-Type’: ‘application/json’,
},
Body: JSON.stringify(data),
})
.then(response => response.json())
.then(data => console.log(data)
삭제
DELETE 요청에는 특정 URL 경로가 필요하며 때로는 삭제할 항목을 지정하기 위해 ID가 전달되기도 합니다. 온라인 구독을 취소하거나 계정을 종료하는 것이 그 예입니다. DELETE 요청의 경우 수행해야 하는 모든 작업은 메서드 유형입니다. 헤더와 본문은 필요하지 않습니다.
fetch(“http://localhost:9000” + id, {
Method: ‘DELETE’
})
.then(response => response.json())
.then(data => console.log(“Deleted”))
가져오기 요청 작업에 사용할 수 있는 더 많은 옵션이 있습니다. 이 블로그에 언급된 옵션은 정보를 수집하고 제출하는 기본 웹 사이트 작업의 대부분에 사용되는 가장 일반적으로 사용되는 옵션입니다. 가져오기 요청을 사용하는 것이 이러한 기본 작업을 수행하는 유일한 방법은 아니지만 JavaScript에 내장된 데이터로 비동기적으로 작업하는 쉽고 논리적인 방법입니다.
Reference
이 문제에 관하여(너무 매력적입니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/tlncook/thats-so-fetching-5f5h텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)