서버와 데이터를 연결하다 보면, 가장 먼저 마주하는 에러는 cors 에러이다. CORS는 보안 상의 이유로 인해 브라우저에서 실행 중인 웹 애플리케이션이 다른 출처(도메인, 프로토콜, 포트)의 리소스에 접근하는 것을 제한하는 정책이다. 따라서, 요청을 보내는 클라이언트에서 CORS 에러를 피하려면 올바른 CORS 헤더를 포함하는 요청을 보내야 합니다. 이를 위해 요청 헤더에 필요한 정보를 추가하여 CORS 정책을 준수해야 합니다. 예를 들어, Access-Control-Allow-Origin 헤더를 설정하여 허용된 출처를 명시할 수 있습니다. 하지만, Access-Control-Allow-Origin 헤더를 설정하였음에도 불구하고 안되는 경우가 있다. 위의 코드에서는 "ngrok-skip-browser-..
Web system
json 서버 설치와 여는방법 https://www.npmjs.com/package/json-server json-server Get a full fake REST API with zero coding in less than 30 seconds. Latest version: 0.17.3, last published: 3 months ago. Start using json-server in your project by running `npm i json-server`. There are 316 other projects in the npm registry using json-ser www.npmjs.com npm install -g json-server npx json-server --watch posts..
대표적인 토큰 기반 인증기술로는 JWT 가 있습니다. JWT (JSON Web Token) 데이터 전송에 사용하는 대표적인 토큰기반 인증기술로, JSON 형식으로 저장한 정보(payload)를 암호화(서명)하여 전송합니다. 클라이언트가 서버에 요청을 보낼때 인증정보를 암호화된 JWT 토큰으로 제공하고, 서버는 이 토큰을 검증하여 인증정보를 확인할 수 있습니다. JWT의 구성요소 JWT는 어떻게 토큰을 암호화하고 이를 검증하는 지 알아봅시다 JWT 기술로 만든 토큰은 보통 다음과 같은 형식의 문자열로 이루어집니다 여기에서 점(.)이 찍힌 부분을 기준으로 헤더(Header) , 페이로드(Payload), 시그니쳐(Signiture) 이렇게 3부분으로 나뉩니다 헤더(Header) 가장 앞에 위치한 헤더에는 마..
세션이란 사용자가 인증에 성공한 상태를 말하고, 토큰이란 교통승차권과 같이, 무언가를 이용할 수 있는 권한이나 자격을 나타내는 징표입니다 토큰 기반 인증방식은 세션 기반 인증이 가지고 있던 한계를 극복하고자 만들어졌습니다. 세션 기반인증은 서버에서 유저의 상태를 관리합니다. 그래서 개발자들은 서버의 부담을 줄이기 위해서, 서버에 사용자의 인증상태를 저장하는 것이 아닌 클라이언트에 이를 저장하는 방법을 고안하였고, 그게 바로 토큰입니다. 세션 기반 인증방식 먼저, 토큰 기반 인증방식이 생겨난 배경인, 세션 기반 인증에 대한 간단하게 알아볼까요? 1. 유저가 인증정보를 담아 서버에 로그인 요청을 보냅니다 2. 서버는 데이터베이스에 저장된 유저의 인증정보를 확인합니다 3. 인증에 성공했다면, 해당 유저에 대한..
HTTPS는 HTTP Secure의 약자로, 단어 뜻 그대로 기존의 HTTP 프로토콜을 더 안전하게(Secure) 사용할 수 있음을 의미합니다.단지 뒤에 S가 붙었을 뿐인데 왜 HTTP보다 안전하다는 걸까요? 그 이유는 HTTPS가 HTTP와 달리 요청과 응답으로 오가는 내용을 암호화하기 때문입니다. HTTP로 보낸 요청을 'wireshark'라는 패킷 분석 프로그램을 이용하여 캡처한 것입니다. 이미지를 확인해 보면, email과 password 같은 값을 그대로 볼 수 있는 것을 알 수 있습니다. 이는 제3자가 HTTP 요청 및 응답을 탈취한다면 전달되는 데이터의 내용을 그대로 확인할 수 있다는 뜻이기도 합니다. 이처럼 HTTPS가 HTTP 통신을 암호화하기 위해서 어떤 과정을 거치는지 조금 더 자세히..
네트워크 계층모델 OSI 7계층 모델 1계층: 물리계층 - 주로 전기신호를 전달하는데 초점, 들어온 전기신호를 그대로 잘 전달하는 것이 목적 2계층: 데이터링크 계층 - 네트워크 기기간 데이터 전송 및 물리주소를 결정하는 계층 3계층: 네트워크 계층 - 라우팅 담당, 빠르게 보낼 최적의 경로 선택 (IP 패킷 전송) 4계층: 전송 계층 - 해당 데이터들이 정상적으로 보내지는 지 확인하는 역할 (TCP/UDP 연결) 5계층: 세션 계층 - 세션의 연결의 설정과 해제를 수행 6계층: 표현계층 - 응용계층으로 전달하거나 전달받는 데이터를 인코딩 또는 디코딩하는 계층, 일종의 번역기 역할 수행 7계층: 응용계층 - 최종적으로 사용자와의 인터페이스를 제공하는 계층, 사용자가 실행하는 응용프로그램들이 해당(chro..
하지만 TCP와 UDP는 IP의 종류가 아니라, IP와 함께 사용되는 전송 계층 프로토콜입니다. IP는 인터넷상에서 패킷 전달을 담당하는 프로토콜이고, TCP와 UDP는 이러한 IP 패킷을 보내고 받는 데이터의 전송을 담당합니다. Q: IP와 TCP와 UDP의 차이점을 모르겠어 A: IP(Internet Protocol)은 인터넷 상에서 컴퓨터들이 서로 데이터를 주고받을 수 있도록 하는 프로토콜로, 인터넷 상에서 데이터를 전송하는 데 사용됩니다. IP는 패킷 단위로 데이터를 전송하며, 각 패킷은 출발지 IP 주소와 목적지 IP 주소를 가지고 있습니다. TCP(Transmission Control Protocol)와 UDP(User Datagram Protocol)는 IP와 함께 사용되는 전송 계층 프로토..
웹표준이란? 2000년대 초에는 인터넷 익스플로러에서는 작동이 되어도 사파리나 파이어폭스 같은 다른 브라우저에서는 작동이 되지 않는 등 브라우저간 호환이 되지 않아서 댓글을 못 다는 정도가 아니라 화면이 아예 정상적으로 나오지 않는 일도 있었습니다. 이를 막고, 웹을 정상적으로 구동시키기 위해서는 개발자들이 각 브라우저마다 따로 개발을 해주어야만 했습니다. 이런 수고를 없애고 웹 개발의 형식을 통일시킨 것이 바로 웹 표준이라고 합니다 웹 표준이란 W3C(World Wide Web Consortium)에서 권고하는 ‘웹에서 표준적으로 사용되는 기술이나 규칙’으로, 사용자가 어떠한 운영체제나 브라우저를 사용하더라도 웹페이지가 동일하게 보이고 정상적으로 작동할 수 있도록 하는 웹 페이지 제작 기법을 담고 있습..