쿠키는 브라우저에 저장되는 작은 크기의 문자열로, RFC 6265 명세에서 정의한 HTTP 프로토콜의 일부입니다. 서버가 HTTP 응답 헤더(header)의 Set-Cookie에 내용을 넣어 전달하면, 이 내용을 자체적으로 브라우저에 저장합니다. 브라우저는 사용자가 쿠키를 생성하도록 한 동일 서버(사이트)에 접속할 때마다 쿠키의 내용을 Cookie 요청 헤더에 넣어서 함께 전달합니다. 사용자가 로그인하면 서버는 HTTP 응답 헤더의 Set-Cookie에 담긴 세션 식별자 정보를 사용해 쿠키를 설정합니다. 사용자가 동일 도메인에 접속하려고 하면 브라우저는 HTTP Cookie 헤더에 인증 정보가 담긴 세션 식별자을 함께 실어 서버에 요청을 보냅니다. 서버는 브라우저가 보낸 요청 헤더의 세션 식별자를 읽어 ..
웹 개발자라면 한 번씩 신고식으로 보는 CORS(Cross-Origin Resource Sharing) 정책에 대해서 정리하려고 합니다. 위의 CORS policy 오류 메시지는 CORS 정책을 위반할 때 발생한다. CORS (Cross-Origin Resource Sharing)간단하게 브라우저에서 다른 출처의 리소스를 공유하는 방법이다. 요청 방식에 따른 CORS1. HTML 태그기본적으로 Cross-Origin 정책을 지원한다. 2.XMLHttpRequest, Fetch API 스크립트기본적으로 Same-Origin 정책을 따른다.다른 도메인의 소스에 대해 자바스크립트 API 호출하는 경우 웹은 크게 두가지의 Origin 정책을 가지고 있다. 그 중 첫번째가 SOP(Same-Origin Poli..
CI/CD는 애플리케이션 개발 단계부터 배포 때까지의 모든 단계를 자동화를 통해서 좀 더 효율적이고 빠르게 유저들에게 배포할 수 있는 것을 말한다. CI/CD는 DevOps 엔지니어의 핵심 업무라고 할 수 있습니다. CI(Continuous Integration)란?지속적인 통합이라는 의미로 애플리케이션의 새로운 코드 변경 사항이 정기적으로 빌드 및 테스트 되어 공유 리포지토리에 통합하는 것을 의미합니다. 애플리케이션에 대한 새로운 코드 변경 사항이 정기적으로 자동화된 빌드&테스트 되어 공유 리포지토리에 통합되므로 다수의 개발자가 형상관리 툴을 공유하여 사용하는 환경 (Git, SVN 등)에서 동시에 애플리케이션 개발과 관련된 코드 작업을 할 경우 서로 충돌할 수 있는 문제를 해결할 수 있습니다. MSA..
OSI 7 Layer 개방형 시스템 상호 연결 모델의 표준 1984년 국제표준화기구(ISO)에서 개발한 모델로써, 네트워크 프로토콜 디자인과 통신 과정을 7개의 계층으로 구분하여 만든 "표준 규격"이다. Layer 1: 물리계층(Physical Layer) 전송에 필요한 두 장치 간의 실제 접속과 절단 등 기계적, 전기적, 기능적, 절차적 특성에 대한 규칙을 정의한다. 디지털 데이터를 아날로그적인 전기적 신호로 변환하여 물리적인 전송을 가능하게 한다. 주소 개념이 없으며, 물리적으로 연결된 노드간에 신호를 주고 받는다. 단위(PDU): 비트(Bit) 주요 장비: 허브(HUB), 리피터(Repeater), 네트워크 카드(Nic, Network Interface Card) 프로토콜: RS-232C, X.21..
가상 사설 네트워크 (VPN, Virtual Private Network) 가상의 사설 네트워크 망으로 인터넷을 통해 디바이스 간에 사설 네트워크 연결을 생성하며, VPN은 퍼블릭 네트워크를 통해 데이터를 안전하게 익명으로 전송하는 데 사용됩니다. 또한 사용자 IP 주소를 마스킹하고 데이터를 암호화하여 수신 권한이 없는 사람이 읽을 수 없도록 합니다 네트워크에서 보안 프로토콜을 사용한 터널링 기술을 이용하여 가상 사설망에 암호화된 데이터를 통신 할 수 있도록 해주는 시스템을 말합니다. 관련 용어 터널링 로컬 시스템과 원격지 시스템 사이에 보안 데이터 터널을 생성하고, 온라인 상태가 되면 단말기와 VPN 라우터 사이에 암호화된 연결이 형성되게 된다. 암호화 데이터를 전송하기 전에 각 IP 패킷의 인증정보를..
현대 웹 개발에서 비동기 프로그래밍은 매우 중요한 역할을 합니다. 사용자 경험을 향상시키고 앱의 반응성을 높이기 위해서는 네트워크 요청, 파일 입출력 등의 비동기 작업을 효율적으로 처리해야 합니다. 그러나 비동기 작업에서 데이터 흐름을 제대로 관리하지 못하면 성능 저하나 예기치 않은 동작이 발생할 수 있습니다. 따라서 비동기 프로그래밍에서는 데이터 흐름을 체계적으로 관리하는 것이 매우 중요합니다. Fetch API와 이중 Await 패턴은 이러한 비동기 프로그래밍에서 데이터 흐름을 관리하는 데 유용한 도구입니다. Fetch API는 Promise 기반의 비동기 HTTP 요청을 처리하는 모던한 인터페이스를 제공합니다. 이중 Await 패턴은 Fetch API와 함께 사용되어 HTTP 응답 처리를 간소화하고..
