[초급] 서버 개발 개요/기본적인 서버-클라이언트 구조와 HTTP 프로토콜 이해

 

웹 애플리케이션 개발에서 가장 중요한 개념 중 하나는 서버-클라이언트 구조와 이를 기반으로 한 HTTP 프로토콜입니다.

이 블로그에서는 서버와 클라이언트의 기본적인 상호작용 방식과 HTTP 프로토콜의 핵심 요소들을 쉽게 이해할 수 있도록 설명하겠습니다.

1. 서버-클라이언트 구조란?

서버-클라이언트 구조는 컴퓨터 네트워크에서 서로 다른 역할을 하는 두 개의 주요 컴포넌트로 이루어진 시스템입니다. 이 구조는 대부분의 웹 애플리케이션에서 사용되며, 클라이언트가 서버에 요청을 보내고, 서버가 그 요청을 처리한 후 응답을 반환하는 방식으로 동작합니다.

 

1.1 클라이언트

• 정의: 클라이언트는 사용자 인터페이스를 제공하며, 사용자의 입력을 받아 서버에 요청을 보내는 프로그램입니다. 웹 브라우저(예: Chrome, Firefox, Safari)나 모바일 앱이 일반적인 클라이언트의 예입니다.
• 역할:
  • 사용자와 상호작용을 통해 데이터를 수집하고, 이를 서버로 전송합니다.
  • 서버로부터 받은 응답을 사용자에게 적절한 형식으로 표시합니다.

1.2 서버

• 정의: 서버는 클라이언트의 요청을 처리하고, 필요한 데이터를 제공하는 역할을 하는 프로그램입니다. 웹 서버, 데이터베이스 서버 등이 이에 해당합니다.
• 역할:
  • 클라이언트가 요청한 데이터를 처리합니다.
  • 데이터베이스와 상호작용하여 정보를 저장하거나 불러옵니다.
  • 클라이언트에게 적절한 응답을 반환합니다.

1.3 서버-클라이언트 상호작용 예시

1. 사용자가 웹 브라우저를 통해 특정 웹사이트에 접속합니다.
2. 브라우저(클라이언트)가 해당 웹사이트의 서버에 페이지 요청을 보냅니다.
3. 서버는 요청을 받아 필요한 데이터를 처리하고, 웹 페이지를 클라이언트에게 반환합니다.
4. 클라이언트는 서버로부터 받은 데이터를 사용자에게 표시합니다.

2. HTTP 프로토콜 이해

HTTP(HyperText Transfer Protocol)는 웹에서 클라이언트와 서버가 데이터를 주고받기 위해 사용하는 프로토콜입니다. HTTP는 텍스트 기반의 프로토콜로, 요청과 응답의 형식이 명확하게 정의되어 있어 클라이언트와 서버가 서로 이해할 수 있습니다.

 

2.1 HTTP 요청(Request)

클라이언트는 서버에 요청을 보낼 때, HTTP 요청을 사용합니다. 이 요청은 여러 부분으로 구성되어 있습니다.

• HTTP 메서드: 서버가 요청을 어떻게 처리해야 할지를 나타내는 명령어입니다. 주요 HTTP 메서드에는 다음이 있습니다:
  • GET: 서버에서 데이터를 요청할 때 사용합니다. 예: 웹 페이지를 요청.
  • POST: 서버에 데이터를 제출할 때 사용합니다. 예: 폼 데이터 제출.
  • PUT: 서버에 데이터를 업데이트할 때 사용합니다.
  • DELETE: 서버에서 데이터를 삭제할 때 사용합니다.
• URL(Uniform Resource Locator): 요청 대상 리소스의 경로를 나타냅니다. 예: https://example.com/api/data.
• 헤더(Header): 요청에 대한 추가 정보를 담고 있습니다. 예: Content-Type, Authorization.
• 본문(Body): POST, PUT 요청과 같이 데이터를 전송할 때 사용됩니다. 예: JSON 형식의 데이터.

2.2 HTTP 응답(Response)

서버는 클라이언트의 요청에 대해 HTTP 응답을 반환합니다. 응답 역시 여러 부분으로 구성됩니다.

• 상태 코드(Status Code): 서버의 응답 결과를 나타내는 숫자 코드입니다. 예:
  • 200 OK: 요청이 성공적으로 처리됨.
  • 404 Not Found: 요청한 리소스를 찾을 수 없음.
  • 500 Internal Server Error: 서버에 오류 발생.
• 헤더(Header): 응답에 대한 추가 정보를 담고 있습니다. 예: Content-Type, Set-Cookie.
• 본문(Body): 클라이언트가 요청한 데이터를 포함합니다. 예: HTML, JSON, 이미지.

2.3 HTTP 프로토콜의 주요 특징

• 무상태성(Stateless): HTTP는 무상태 프로토콜입니다. 이는 각각의 요청이 독립적으로 처리되며, 이전 요청의 상태를 기억하지 않는다는 것을 의미합니다. 예를 들어, 사용자가 로그인한 상태를 유지하려면 쿠키나 세션을 사용해야 합니다.
• RESTful API: REST(Representational State Transfer) 아키텍처 스타일을 따르는 API는 HTTP의 메서드(GET, POST, PUT, DELETE)와 URI 구조를 사용하여 자원을 관리합니다. RESTful API는 클라이언트-서버 구조에서 자주 사용됩니다.

3. 서버-클라이언트 구조와 HTTP 프로토콜의 실제 예시

이해를 돕기 위해 간단한 Dart 서버와 클라이언트 간의 상호작용 예제를 살펴보겠습니다.

 

3.1 간단한 Dart 서버 예제

import 'dart:io';
import 'package:shelf/shelf.dart';
import 'package:shelf/shelf_io.dart' as shelf_io;

void main() async {
  var handler = const Pipeline()
      .addMiddleware(logRequests())
      .addHandler((Request request) {
    if (request.method == 'GET' && request.url.path == 'hello') {
      return Response.ok('Hello, World!');
    }
    return Response.notFound('Page not found');
  });

  var server = await shelf_io.serve(handler, 'localhost', 8080);
  print('Server running on localhost:${server.port}');
}

이 서버는 http://localhost:8080/hello에 GET 요청을 받으면 "Hello, World!"라는 응답을 반환합니다.

 

3.2 간단한 HTTP 클라이언트 요청

import 'dart:convert';
import 'package:http/http.dart' as http;

void main() async {
  var url = Uri.parse('http://localhost:8080/hello');
  var response = await http.get(url);

  if (response.statusCode == 200) {
    print('Response: ${response.body}');
  } else {
    print('Failed to load data');
  }
}

이 클라이언트 코드는 위 Dart 서버에 GET 요청을 보내고, 서버로부터 "Hello, World!" 응답을 받아 출력합니다.

 

 

서버-클라이언트 구조와 HTTP 프로토콜은 웹 애플리케이션 개발의 근간을 이루는 중요한 개념입니다.

클라이언트는 서버에 요청을 보내고, 서버는 그 요청에 따라 데이터를 처리하고 응답을 반환하는 상호작용을 통해 애플리케이션이 동작합니다. HTTP 프로토콜은 이러한 요청과 응답의 형식을 정의하여, 클라이언트와 서버가 일관된 방식으로 통신할 수 있도록 도와줍니다.

Dart와 같은 언어를 통해 이러한 구조를 쉽게 구현할 수 있으며, 이를 통해 효율적인 웹 애플리케이션을 개발할 수 있습니다.

구독!! 공감과 댓글은 저에게 큰 힘이 됩니다.

Starting Google Play App Distribution! "Tester Share" for Recruiting 20 Testers for a Closed Test.

Tester Share [테스터쉐어] - Google Play 앱