본문 바로가기
개발새발 대외활동/개발 | KB국민은행 It's Your Life 5기

[002] 웹 어플리케이션 구조

by 카랑현석 2024. 5. 12.

웹 어플리케이션 구조 (★★★)

웹 어플리케이션 구조

 

[http Server]

- 국민은행 사이트 주소를 치면 Web SERVER로 http 요청을 보낸다.

 

- 그러면 서버가 http 요청이 들어온 것을 인식하고 http 응답을 한다. (Http Server)

즉, http Server : "저 Browser가 http 요청을 했구나!"

즉, 하나의 컴퓨터에서 사파리, 파이어폭스, 크롬에서 각각 똑같은 사이트인 네이버 사이트를 들어갔다고 했을 때 3개의 요청이 들어왔다고 판단한다.

 

- http의 header에서 주소를 뽑아내서 요청을 인식하면 적절한 것을 처리할 함수가 필요하다. (Router)

즉, Router : "이 요청은 첫 페이지니까 이 요청을 처리해줄 수 있는 것은 저 함수야. 호출해줄게."

 

- 이미 http Server는 존재한다.

 

[Application Server]

- http Server에 의해 요청이 분석되면 그 분석한 정보를 실제적으로 처리하는 서버가 별도로 필요한데, 그 서버를 Application Server 라고 한다.

- 웹과 관련된 Application Server 이므로 Web Application Server(WAS) 라고 한다.

 

- DB연동 등 내부적인 처리를 담당 (Spring framework로 처리)

 

[API]

- 근데 client 측이 Web SERVER에 없는 데이터 (예를 들면 날씨 데이터, 공공데이터 등)를 가져온다고 하면 OpenAPI을 통해 Browser가 직접 요청하고 받아와서 렌더링한다. 

 

 

네트워크 기본 2대 요소 (★★)

- http 통신을 하기 위한 네트워크의 기본 2대 요소는 (ip)와 (port 번호) 이다.

- 즉 ip와 port 번호가 request을 인식하는 단위이다.

 

- IP : 인터넷 상의 주소체계

- PORT : IP 주소가 가리키는 PC에 접속할 수 있는 통로

웹 어플리케이션 동작방식

브라우저가 요청을 할 때 서버에서 준비가 되어 있어야 한다.

어떤 준비? -> 파일(응답 데이터)을 가지고 있어야 한다.

127.0.0.1 ip을 가진 컴퓨터가 8080 포트에서 web02 폴더 아래의 ajax1.html 파일을 띄워준다.
요청과 응답 모두 http 통신 사용

 

[HTTP의 특징]

- 무연결성(connectionless) : 한 번 요청하고 한 번 응답을 완료하면 통신을 끊어버린다. = 연결 유지 X (왜냐하면 client가 너무 많으니까..)

 

- 무상태성(stateless) : 모든 http 요청은 독립적이어서 서버는 클라이언트의 상태를 기억하지 못한다. (다시 요청하면 까먹고 있음)

-> 송금이나 로그인 정보 저장 등에서는 연결이 계속 유지가 되어야 한다. -> 그래서 session(세션)이 생겨났다. 

 

- 요청정보(request) : 클라이언트 -> 서버, 서비스를 요청한 클라이언트에 관한 정보를 가지고 있음. (ip, port로 요청을 인식)

- 응답정보(response) : 서버 -> 클라이언트, 서비스 응답하는 정보를 가지고 있음. http로 전달할 대상으로 만드는 역할.

 

[HTTP의 요청(request)와 응답(repsonse)]

요청(request) : 클라이언트가 서버로 보내는 메시지

- Header : 요청에 대한 부가적인 정보

- Body : 요청과 함께 서버로 전달되는 데이터

 

응답(response) : 서버가 클라이언트로 보내는 메시지

- Header : 응답에 대한 부가적인 정보

- Body : 서버에서 클라이언트로 전송되는 데이터

 

[404 Error]

라우팅 에러, 요청하고자 하는 주소에서 파일을 찾을 수 없는 경우 생기는 에러

Ex) http://127.0.0.1/8080/web02/ajax03.html 사이트 접속 시 404 에러 발생

-> ip가 127.0.0.1 이고 port 번호가 8080인 서버 컴퓨터에서 web02 파일의 ajax03.html 파일을 찾을 수 없다.

 

 

정적 데이터 vs 동적 데이터

이미지,CSS,HTML : 정적인 파일

 

자신의 IP 조회 

cmd(명령 프롬프트) 을 켜서 ipconfig 명령어 입력 > IPv4 Address 값 확인

 

DNS(Domain Name System) 통신 방식

사이트에 접속할 때 ip와 port 번호가 중요하다고 했는데, 네이버를 접속할 때 ip와 port 번호를 알고 있는가?

알고 있지 않은데 어떻게 접속하지?

-> ip와 port 번호와 매핑되는 Domain Name 이라는 것을 만들어서 접속하고 있다. (https://naver.com/)

 

즉, https://naver.com/ 이라는 Domain Name을 치면 그 것을 변환해주는 서버가 있어 우리가 ip와 port을 몰라도 접속할 수 있는 것이다.

 

[DNS 동작 원리]

www.wikipedia.org 사이트에서 먼저 처음에는

1) root nameserver가 org의 ip 주소를 찾고 org nameserver에 알려준다.

2) org nameserver가 wikipedia 의 ip 주소를 찾고 wikipedia.org namesserver에 알려준다.

3) wikipedia.org nameserverwww.wikipeida.org  의 ip 주소를 찾아 최종적으로 ip 주소를 찾고 알려주게 된다.

DNS 동작 원리