2024/05 8

[javascript] express로 사용자 req 분석하기

node.Js express로 req를 분석해보자. 1. 사용자 ip 받아오기루프백 서버const express = require('express');const app = express();// IPv6 주소에서 IPv4 주소를 추출하는 함수function extractIPv4(ip) { if (ip === '::1') { return '127.0.0.1'; }else if (ip.includes('::ffff:')) { return ip.split('::ffff:')[1]; } return ip; } app.get('/', (req, res) => { // IP 주소 가져오기 const ip = req.headers['x-forwarded-f..

[javascript] Buffer(버퍼)란? | 장,단점과 노드js를 활용한 예시

버퍼 파일을 읽거나 쓸 때 한 덩어리로 처리하지않고 작은 단위로 시간을 절약하는 방법이다.전송 속도를 조절하거나, 데이터의 흐름을 제어하기 위해 데이터를 한 곳에서 다른 한 곳으로 전송하는 동안 일시적으로 그 데이터를 보관하는 물리적인 메모리 영역이다.주로 입출력시에 많이 사용하는데, 예를 들어 파일을 읽어올 때  데이터가 바로 전달되지 않고 우선 출력버퍼에 데이터가 저장된다.그러다가 버퍼가 가득 차거나 특정 경우가 발생 시(개행 문자, 엔터 등) 그 내용을 전달한다.보통 이렇게 버퍼 단위로 전송할 때, '버퍼를 비운다'고 표현하며,전달받은 입장에서는 전체 내용을 한번에 다 가져오지 않고 버퍼 하나 크기 만큼만 받게 된다.    - 버퍼의 크기는 고정되지 않을 수 있다. 버퍼의 크기는 시스템 설정이나 프..

[javascript] Stream(스트림)이란? | 장,단점과 노드js를 활용한 예시

스트림 스트림(Stream)은 대용량의 데이터를 효율적으로 처리하기 위한 추상화된 인터페이스이다.파일을 읽거나 쓸 때 한 덩어리로 처리하지않고 작은 단위로 시간을 절약하는 방법으로,한 방향으로 흐르는 데이터의 큰 흐름이라고 볼 수 있다.스트림은 운영체제에 의해 생성되며, 가상의 연결고리로써 데이터가 흐르는 중간 다리 역할을 한다.또한 스트림은 데이터를 작은 청크(chunk) 단위로 처리하므로,메모리 사용을 최소화하고 데이터 처리를 효율적으로 할 수 있다.참고로 개발 시 스트림을 만들면, RAM에 쌓이기 때문에 다 쓰고 반드시 닫아줘야 한다.강물이 넘쳐흐르면 안되기 때문이다.   스트림은 이벤트 기반의 API를 사용하여데이터 읽기, 쓰기, 변환 등의 작업을 비동기적으로 수행한다.    Readable St..

[javascript] Node.js와 express 비교

자바스크립트는 Html 태그를 동적으로 추가하고 웹의 동적인 동작을 처리할 때 사용된다.뿐만 아니라 클라이언트에 동적인 기능을 제공함과 동시에 단일 언어로 클라이언트와 서버를 모두 개발할 수 있는 가능성이 있다. 자바스크립트를 통해 서버를 개발하고 구동할 수 있는 방법엔 두 가지가 있다.바로 Node.js와 express다. 오늘은 이 두가지를 통해 서버를 구동하고그 문법에는 어떤 차이가 있으며 각 특징은 어떤지 포스팅하고자 한다.  Node.js 특징   1. 비동기 I/ONode.js는 비동기식 입출력을 기본으로 하여 높은 성능을 발휘한다. 이는 많은 요청을 동시에 처리할 수 있게 한다.ex:) 채팅 애플리케이션많은 사용자가 동시에 메시지를 주고받는 실시간 애플리케이션에 비동기 I/O를 사용하면 각 ..

[javascript] 콜 스택과 이벤트 루프 | 동기/비동기 처리 차이?

동기 처리란, 쉽게 말해 순차적인 처리를 의미한다.만약 응답과 요청이 동기라면, 어떤 일이 발생할까?A 클라이언트가 요청을 보냈다고 하자. Aa서버는 요청을 받고 응답을 한다.문제 없다. 케이스를 바꿔보자.A 클라이언트와 B 클라이언트가 요청을 보냈다고 하자. Aa 서버는 요청을 각각 받고 각각 응답을 한다.여기까진 괜찮을 지도 모른다.   그런데 보통, 클라이언트:서버는 다:1 관계다.서버는 다중 처리를 해야 하는 경우가 대부분이다.이렇게 요청을 받을 때는 참고로 콜 스택을 사용하기 때문에 계속 요청이 쌓이게 되는 것이다.이렇게 되면 나중으로 갈수록 대기 시간이 천문학적으로 길어지게 되고이러한 불편함은 클라이언트가 감수해야 된다. 성능은 크게 떨어지고 서버의 부하도 심해질 것이다. ⇒ 고로 서버를 동기..

[Web] 웹 서버와 WAS 차이점에 대해 아시나요? Apache vs Tomcat

■ 웹 애플리케이션 동작 원리를 살펴보자 웹 애플리케이션 = 우리가 인터넷을 통해 사용하는 모든 서비스로,  사용자의 브라우저와 서버 간의 상호작용을 통해 동작한다.사용자가 요청을 보내고, 서버가 이를 처리하여 응답을 보내는 과정을 반복함으로써 우리가 웹을 통해 다양한 서비스를 이용할 수 있는 것이다. 이 때 브라우저와 서버 간 상호작용은 HTTP 프로토콜을 기반으로 한다.클라이언트와 서버가 HTTP 프로토콜을 기반으로 통신하는 것이다.   HTTP 프로토콜 HTTP 프로토콜은 1)무연결성과 2)무상태성을 포함하여 각 요청과 응답이 독립적으로 처리되는 특징을 가지고 있다. 이를 통해 클라이언트와 서버 간의 효율적인 통신이 가능하며, 요청과 응답에는 각각의 정보가 포함되어 있어 서로의 상태를 이해하고 처리..

Web 2024.05.13

[Web] 웹 브라우저 내부 구조 한 눈에 보기!👓 / 브라우저 엔진, 렌더링 엔진? / 돔 트리

웹 브라우저 (Web Browser) 의 내부 구조를 이해하는 것은마치 자동차를 잘 운전하기 위해 엔진과 페달의 역할을 알아야 하는 것과 비슷하다.🚗 웹 브라우저도 내부를 알아야 각 동작에 발생하는 일을예측하고, 해석할 수 있게 된다. 즉 잘 다룰 수 있게 되는 것이다.  오늘은 웹 브라우저의 내부구조와주요한 엔진이 어떤 역할을 하고, 어떤 과정을 거쳐우리에게 요청한 페이지를 보여주는지 간단하게 살펴보도록 하자.    1. 구성 요소웹 브라우저의 내부 구조는 여러 주요 구성 요소로 이루어져 있다.사용자 인터페이스(UI)사용자가 상호작용하는 부분으로, 주소 표시줄, 이전/다음 버튼 등이 포함된다.브라우저 엔진사용자 인터페이스와 렌더링 엔진 사이의 상호작용을 담당한다.렌더링 엔진HTML과 CSS를 파싱하여..

Web 2024.05.12

[Network] 네트워크 통신을 위한 포트의 역할과 필요성

네트워크에서 통신하는 모든 개체들을 통틀어 '노드' 라고 표현한다. (클라이언트, 서버를 아우르는 개념)쉽게 말해 '통신에 참여하는 모든 단말'을 뜻한다.    예를 들어보자.네트워크 A에 컴퓨터 20대와 허브 2개 공유기 2개, 그리고 라우터가 있다면,네트워크 A에 속한 장비들은 하나의 노드로 친다. 여기서 주의!!★ 헷갈리지 말아야 할 것이,기기나 단말 하나를 독립적인 노드로 여기는 것이 아니라, 통신의 말단, 종단점을 노드로 여기기 때문에하나의 노드 안에 다양한 장비들이 포함 될 수도 있다는 것이다. 그리고... 이 노드를 서로 연결하는 것이 '링크' 이다.  아무튼 네트워크 통신은 이와 같이 노드와 링크의 구조로 이루어진다. 오늘은 프로토콜과 포트에 대해 이야기하고자 한다.이 노드와 링크로 이루어..

Server 2024.05.12