서버 요청하기
서버와 클라이언트
- 요청하는 주체: 클라이언트
- 요청에 따른 응답을 주는 서버
날씨 앱
(클라이언트)
날씨 api 서버
서울 날씨 보내줘
서울 날씨는 27도야
서버에게 요청하기
- 일반적으로 서버에게 HTTP (URL) 요청 후, 응답을 처리
- 응답은 다양한 형태로 받을 수 있음 (JSON, HTML, plain text 등등)
날씨 api 서버
/weather?q=Seoul
{ “tempature”: 27 }
날씨 앱
(클라이언트)
HTTP 요청은 fetch API로
날씨 api 서버
/weather?q=Seoul
{ “tempature”: 27 }
날씨 앱
(클라이언트)
fetch('http://서버주소/weather?q=Seoul')
.then(function(resp) {
// 응답 형식에 따라 resp.text() 가 될 수도 있다
return resp.json();
})
.then(function(json) {
console.log(json); // { tempature: 27 }
});
날씨 API 사용
API 사용시 유의할 점
- API는 공짜가 아닙니다
- 서비스 제공자로부터 권한을 받아야 한다
- 그러므로 API Key는 암호처럼 취급되어야 합니다
서버에 기록할 수도 있나요?
- HTTP 요청을 GET이 아닌 POST를 이용
- 내용(payload)와 함께 전달
- 예제
- 게시판에 새로운 글을 쓰고자 할 때
- 아이디와 비밀번호로 로그인을 하고자 할 때
서버에 기록할 수도 있나요?
서버
성공적으로 작성했어!
{ id: 123 }
(보통 새로운 글의 id를 반환합니다)
클라이언트
게시판에 새로운 글을 쓰고 싶어!
방법은: POST
주소는: /posts
내용은: { ‘userId’: 1, ’title’: 제목, ‘body’: 내용}
서버
성공적으로 작성했어!
{ id: 123 }
(보통 새로운 글의 id를 반환합니다)
클라이언트
게시판에 새로운 글을 쓰고 싶어!
방법은: POST
주소는: /posts
내용은: { userId: 1, ‘title’: 제목, ‘body’: 내용}
let newPost = {
"userId": 1,
"title": "새 글을 써봤습니다",
"body": "안녕하세요?"
}
fetch('http://서버주소/posts', {
method: 'POST',
body: JSON.stringify(newPost)
}).then(function(resp) {
return resp.json();
}).then(function(json) {
console.log(json); // { id: 123 }
});
다양한 API를 이용해보고 싶어요
직접 API 서버를 개발해보고 싶어요
서버 개발과 관련된 환경을 배웁시다 - node.js (JavaScript)
END
서버 요청하기
By Codestates
서버 요청하기
- 2,248