Computer Science/WEB

Cross Origin Resource Sharing, CORS란?

문제의 시작 Access to fetch at 'http://서버IP:8080/signup' from origin 'API호출한IP' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled 프론트와의 협업을 위해 AWS에 Spring boot..

Access Token & Refresh Token 원리

Access Token & Refresh Token 이번 포스팅에서는 기본 JWT 방식의 인증(보안) 강화 방식인 Access Token & Refresh Token 인증 방식에 대해 알아보겠다. JWT(Json Web Token)에 대한 내용은 아래 포스팅 참고. JWT 토큰 인증 이란? (쿠키 vs 세션 vs 토큰) Cookie / Session / Token 인증 방식 종류 보통 서버가 클라이언트 인증을 확인하는 방식은 대표적으로 쿠키, 세션, 토큰 3가지 방식이 있다. JWT를 배우기 앞서 우선 쿠키와 세션의 통신 방식을 살펴보 s-y-130.tistory.com Access Token의 문제점과 Refresh token은 왜 필요한가? Access Token 만을 통한 인증 방식의 문제는 만일 ..

JWT 토큰 인증 이란? (쿠키 vs 세션 vs 토큰)

Cookie / Session / Token 인증 방식 종류 보통 서버가 클라이언트 인증을 확인하는 방식은 대표적으로 쿠키, 세션, 토큰 3가지 방식이 있다. JWT를 배우기 앞서 우선 쿠키와 세션의 통신 방식을 살펴보고 이들의 각각 특징과 장단점 그리고 왜 토큰 인증 방식을 사용하지는에 대해 알아보자. Cookie 인증 쿠키는 Key-Value 형식의 문자열 덩어리이다. 클라이언트가 어떠한 웹사이트를 방문할 경우, 그 사이트가 사용하고 있는 서버를 통해 클라이언트의 브라우저에 설치되는 작은 기록 정보 파일이다. 각 사용자마다의 브라우저에 정보를 저장하니 고유 정보 식별이 가능한 것이다. Cookie 인증 방식 브라우저(클라이언트)가 서버에 요청(접속)을 보낸다. 서버는 클라이언트의 요청에 대한 응답을 ..

OAuth 2.0 개념

OAuth란? 웹을 사용하다 보면 Google과 Facebook 등의 외부 소셜 계정을 기반으로 간편히 회원가입 및 로그인할 수 있는 웹 어플리케이션을 쉽게 찾아볼 수 있다. 클릭 한 번으로 간편하게 로그인할 수 있을 뿐만 아니라, 연동되는 외부 웹 어플리케이션에서 Facebook 및 Twitter 등이 제공하는 기능을 간편하게 사용할 수 있다는 장점이 있다. 예를 들어, Google로 로그인하면 API를 통해 연동된 계정의 Google Calendar 정보를 가져와 사용자에게 보여줄 수 있다. 이 때 사용되는 프로토콜이 바로 OAuth다. OAuth에 대한 정의는 다음과 같다. OAuth는 인터넷 사용자들이 비밀번호를 제공하지 않고 다른 웹사이트 상의 자신들의 정보에 대해 웹사이트나 애플리케이션의 접근..

호스팅이란 무엇인가?

​호스팅이란 ​호스팅이란 서버나 웹 사이트를 인터넷 상에서 이용할 수 있게 공간을 임대 해주는 서비스이다. 웹 호스팅은 웹 사이트를 구성하는 여러 파일(e.g. 코드, 이미지 등)을 온라인에서 볼 수 있게 해준다. 우리가 호스팅을 위해 임대하는 서버의 공간은 호스팅 종류에 따라 다르다. 즉, 웹 사이트나 웹 페이지를 구성하기 위한 호스팅과, 서버를 열기 위한 호스팅은 관리 방법과 제공받는 서비스, 추가적인 서비스 등이 다르다. 여기서 말하는 공간이란, 우리가 서버를 열기 위해 필요한 자원들을 말한다. CPU, RAM, 하드 디스크, IP Address, 서버를 설치할 컴퓨터와 컴퓨터의 온습도와 전력 관리등 다양한 자원들을 빌려 직접 운영 하기에는 부담이 큰 다양한 자원들을 빌려 필요한 만큼만 사용할 수 ..

브라우저와 동작 원리

브라우저 동작 원리 우리가 평소에 접하는 이 화면은 도대체 어떻게 나타나게 되는 것일까? ​ 우리는 평소처럼 당연하게 인터넷 주소창에 주소를 입력하고 거기에 해당되는 홈페이지 화면에 접속하며 사이트를 돌아다니기만 했지, 이렇게 화면이 보여지는 과정이 어떻게 동작하는지는 생각해보기는 쉽지 않다. ​ 또한 프론트엔드 개발자 역시, HTML과 CSS 문서를 작성하고 Javascript 코드를 짜면서 기대하던 동작을 확인하며 웹 개발을 했을 것이고, 실제로 이 HTML문서가 어떻게 자리를 잡아서 웹 페이지에 각자 자리에 DOM 요소들이 세팅이 되고 CSS 스타일이 적용돼서 그려지는지 맘 잡고 학습해보지 않는 이상 생각해보는 경우가 없을 것이다. ​ 그래서 이참에 맘 잡고 한번 자세히 알아보자. ​브라우저의 주요..

하드웨어 관점에서 인터넷은 어떻게 연결되는가?

인터넷이란? 정보를 담고 있는 각 컴퓨터들을 TCP/IP 라는 통신 프로토콜을 이용해 서로 정보를 주고받도록 하는 컴퓨터 네트워크를 말한다. 인터넷의 역사는 자세히 알려지지 않았지만 1960년대 한 연구 프로젝트에서 시작되었다고 한다. 그리고 1980년대에 들어서 많은 지원이 추가되며 공공 기반의 서비스로 진화해왔다. 인터넷은 지금에 이르기까지 많은 진화를 해왔지만 작동방식 자체는 크게 변하지 않았다. 인터넷은 다수의 컴퓨터를 연결하고 어떤 일이 있어도 연결 상태를 유지할 수 있는 방법을 찾는 방법이다. 인터넷 네트워크 종류 (발전 과정) 단순한 네트워크 ​A와 B라는 pc가 통신을 하기 위해서는 한개의 통신 케이블이 필요하다. ​ 다수의 네트워크 ​그렇다면 위 사진처럼 다수의 컴퓨터를 연결하는 경우에는..

웹 소켓 (Socket) 정리

​웹 개발을 처음 배우기 시작했다면 서버와 클라이언트의 통신은 모두 HTTP 프로토콜만 이용해서 이루어진다고 생각할 수 있다. 하지만 웹 개발을 하면서 채팅, 게임, 주식 차트 등의 실시간 통신이 필요한 서비스를 구현하려 하면 HTTP 프로토콜이 아닌 웹소켓 프로토콜을 사용하는 것이 좋다는 이야기를 들어왔을 것이다. HTTP의 한계 [HTTP] HTTP란? HTTP(Hyper Text Transfer Protocol)란? HTTP(Hyper Text Transfer Protocol)란 서버-클라이언트 모델을 따르면서 request/response 구조로 웹 상에서 데이터를 주고 받을 수 있는 프로토콜(규칙)이다. TCP/IP 기반으로 작동 s-y-130.tistory.com HTTP는 약속이다. 약속을 ..

웹 서비스 구조 (Web서버 / 웹컨테이너 / WAS)

Static vs Dynamic 페이지 정적 페이지 (Static Pages) 데이터베이스에서 정보를 가져오거나 등 별도의 서버에서의 처리가 없어도, 사용자들에게 보여줄 수 있는 페이지. 어떠한 사용자가 오던간에 동일한 페이지를 보여준다. Ex) image, html, css, javascript 파일과 같이 컴퓨터에 저장되어 있는 파일들 ​ 동적 페이지 (Dynamic Pages) 서버의 데이터베이스에서 정보를 가져와서 처리하는 것처럼, 어떠한 요청에 의하여 서버가 일을 수행하고 해당 결과가 포함된 파일을 보여주는 페이지. 사용자들마다 다른 페이지가 보여질 수 있다. Web Server와 WAS의 차이 Web Server 웹 서버는 클라이언트가 요청한 정적인 콘텐츠를 HTTP 프로토콜을 통하여 제공해주..

URL / URI / URN 차이점

URL / URI / URN 차이점 우리가 브라우저를 통해 웹을 이용하게 된다면, URL 단어는 익숙할 것이다. 하지만 가끔 뭔가 비슷하면서도 다른 URI와 URN 이라는 단어를 사용하기도 하는데 이들 URL / URI / URN 링크 문자의 명확한 차이를 알아보도록 하겠다. 아래 그림에서 볼수 있듯이, URI는 URL과 URN을 포함하고 있다. 이들의 각 뜻은 다음과 같이 정의할 수 있다. URI - 자원의 식별자 URL - 위치(Location) URN - 이름(Name) URI / URL / URN 정의 URI (Uniform Resource Identifier) URI는 특정 리소스를 식별하는 통합 자원 식별자(Uniform Resource Identifier)를 의미한다. 웹 기술에서 사용하는 ..