31일차 - 자바 스크립트 기본 문법(4)

HTTP (HyperText Transfer Protocol)

HTTP는 웹 브라우저와 웹 서버가 데이터를 주고받을 수 있게 디자인된 통신 규약이다.

HTTP는 웹에서 이루어지는 모든 데이터 교환의 기초이며, 이 규약을 암호화하여 보안을 확보한 규약은 HTTPS라 한다.

 

 

 

HTTP 통신

HTTP에서는 클라이언트(사용자)가 서버(호스트)에 요청 메시지를 보내고 이에 대해 서버가 응답 메시지를 반환한다.

서버는 응답 메시지를 반환한 후에 초기 상태로 돌아간다.

이러한 특징으로 인해 HTTP를 stateless 규약이라고도 한다.

 

사용자가 인터넷 주소창에 주소를 입력하는것을 요청이라 하고, 해당 홈페이지 서버에서 HTML문서를 보내는 것을 응답이라 한다.

 

 

 

HTTP 요청과 응답 - 요청

HTTP 요청 메시지는 요청 행, 요청 헤더, 메시지 본문으로 구성된다.

 

• 요청 행: 요청 메소드, URL, HTTP 버전 정보 등을 포함한다.

• 요청 헤더: 메시지 정보, 메세지에 저장한 데이터 정보 등을 포함한다.

• 메시지 본문: 서버 측으로 보내는 데이터를 포함한다.

 

요청 메소드  =>  GET, POST 등 데이터 송수신 방식을 지정한 것

 

 

 

HTTP 요청과 응답 - 응답

HTTP 응답 메시지는 응답 행, 응답 헤더, 메시지 본문으로 구성된다.

 

• 응답 행: 상태 코드, 보충 메시지, HTTP 버전 정보 등을 포함한다.

• 응답 헤더: 메시지 정보, 메세지에 저장한 데이터 정보 등을 포함한다.

• 메시지 본문: 클라이언트 측으로 보내는 데이터를 포함한다.

 

상태 코드   =>   요청이 성공적으로 완료되었는지를 보여주는 숫자 코드

 

 

주요 상태 코드

상태 코드는 요청이 성공적으로 완료되었는지를 보여주는 숫자 코드이며, 각 숫자마다 의미가 정해져 있다.

 

 

 

 

XMLHttpRequest

XMLHttpRequest는 서버와 상호작용하기 위해 사용하는 자바스크립트 내장생성자이다.

이를 이용하면 서버(URL)로부터 데이터를 받아와 전체 페이지의 새로고침 없이도 페이지의 일부만 업데이트하는 비동기 방식의 데이터 통신을 수행할 수 있다.

 

=> 이러한 프로그래밍 기법을 Ajax라 한다.

 

 

 

Ajax

Ajax(Asynchronous JavaScript And XML)는 웹 서버와 비동기로 통신하고 DOM을 이용하여 웹 페이지를 동적으로 갱신하는 프로그래밍 기법을 말한다.

 

 

 

XMLHttpRequest 사용 흐름

Ajax 기법에 기초한 XMLHttpRequest 비동기 통신은 다음 세 단계를 거친다.

 

1. XMLHttpRequest 객체를 생성한다.
2. 서버와 통신할 때 필요한 정보 및 처리 방법 등을 기입한다.
3. 요청을 전송해 통신을 시작한다.

 

 

 

 

이벤트핸들링

비동기 통신을 할 때는 서버와의 통신 상태를 감시할 수 있다.

그리고 이때 발생하는 이벤트에 대한 이벤트 핸들러를 등록할 수 있다.

 

 

 

 

요청 초기화하고 보내기

서버에 요청을 보낼 때는 XMLHttpRequest 객체의 open 메소드로 요청을 초기화하고, 이후 send 메소드로 보내주는 순서가 일반적이다.

 

 

 

 

 

 

내용 정리

•HTTP는 브라우저와 서버가 데이터를 주고받을 수 있는 통신 규약이다.
•HTTP에서는 클라이언트(사용자)가 서버(호스트)에 요청 메시지를 보내고 이에 대해 서버가 응답 메시지를 반환한다. •HTTP 요청 메시지는 요청 행, 요청 헤더, 메시지 본문으로 구성되며, 대표적으로 요청 메소드와 URL을 포함한다. •HTTP 응답 메시지는 응답 행, 응답 헤더, 메시지 본문으로 구성되며, 대표적으로 상태 코드와 응답에 따라 얻어진 결과 데이터를 포함한다.

•XMLHttpRequest는 서버와 상호작용하기 위해 사용하는 내장 생성자이다.
•Ajax는 웹 서버와 비동기로 통신하고 DOM을 이용하여 웹 페이지를 동적으로 갱신하는 프로그래밍 기법을 말한다. •Ajax에 기초한 XMLHttpRequest 객체의 비동기 통신은 객체 생성, 이벤트 핸들링 및 초기화, 요청 보내기의 세 단계를 거친다.