개발 연습 블로그

🐱‍👤 애플리케이션에서 유저 특정하고, 각기 다른 권한을 주기 위해 필요한 작업 순서 🦥 1. 회원가입 2. 로그인 (authentication = 인증) 3. 로그인 이후의 요청과 응답 (authorization = 인가) 이미 로그인한, 권한있는 유저의 요청인지 체크 (1) 쿠키에 유저 정보 담는 방식 (원시적) (2) 세션 방식 근데 세션 방식의 단점은 스케일이 커졌을 때 발생한다. (효율성 문제...) 서버를 여러대 두게 되었을 때 (3) 토큰 방식 토큰 구현 방식에는 몇가지 선택지가 있는 것 같다. - 토큰 타입 : JSON (= JWT ) / XML ( = SAML) - 토큰을 어디에 담아 보낼지 : 쿠키 / Authorization Header (참고) If the token is sent ..

😎 2021.04.30 - [WEB] - 쿠키, 세션, passport.js 지난시간 localstrategy 복습 인증 요청 이후 모든 요청 OAuth2.0 delegating user authentication to the service that hosts the user account, and authorizing third-party applications to access the user account. 이부분은 나중에 까먹으면 생활코딩 OAuth2.0 강의를 또 듣자... google login 간단한 구현 코드 1편과 동일한데 strategy 만 local => google로 바꿨다. const express = require('express'); const app = express(); c..

쿠키 An HTTP cookie(also called web cookie, Internet cookie, browser cookie, or simply cookie) is a small piece of data stored on the user's computer by the web browser while browsing a website. Cookies were designed to be a reliable mechanism for websites to remember stateful information 유저단은 브라우저가 알아서 해주니까 신경안써도 되고, node.js express 서버에서는 예를들어 이런식의 작업들을 하면 쿠키라는 것을 적용할 수 있다. (1) set-cookie (2) htt..

이젠 create-react-app프로젝트와 express 서버 간의 요청의 경우를 살펴보자. create-react-app 프로젝트의 스크립트 안에서 서버에 어떻게 CORS policy를 위반하지 않고 http request를 잘 보낼 수 있을까? [1] 빌드해서 연결해서 요청보내기 (npm run build) => 같은 오리진이니까 문제 없다 간이 예를 들어보자면 빌드 명령어 결과로 생성된 build 디렉토리 아래다가 이런 간단한 express 서버를 만들어서 연결해보자. [2] npm start 명령어일때 드디어 CORS 문제 발생 => 최종 연결할 서버가 아니라 dev용 서버에 연결되어 돌아가기 때문에. ( 참고 ) create-react-app 의 dev 서버에 대한 글 : 2021.02.27 ..

CORS가 뭔지 알아보려고 구글링하는데 create-react-app으로 생성한 react랑 express서버를 프록시나 cors설정으로 연결하는 블로그 글이 있었다. react로 뭘 만들어본 적이 없어서 그 글을 읽어도 어떤 맥락에서 저런 설정을 해야하는건지 낯설었다. 이번에 알아보도록 하자. 개념 알아보기 proxy In computer networking , a proxy server is a server application or appliance that acts as an intermediary for requests from clients seeking resources from servers that provide those resources. - 위키피디아 forward proxy vs ..

간단한 node 웹소켓 예제를 따라 해 보다가, WebSocket is distinct from HTTP. Both protocols are located at layer 7 in the OSI model and depend on TCP at layer 4. [위키피디아] 이렇게 웹소켓과 http는 엄연히 다른거라는데 왜 요렇게 http서버로 웹소켓을 만들지?라는 궁금증에 찾아보다가 좋은 글을 발견해서 정리해두려고 한다. 이 글을 기반으로 작성되었습니다. 😎 참고 : https://codeburst.io/polling-vs-sse-vs-websocket-how-to-choose-the-right-one-1859e4e13bd9 두 가지 접근법 (서버로부터 변경사항을 그때 그때 전달받을 수 있는 방법은 없을..

Web Server vs Application Server 참고 : https://www.educative.io/edpresso/web-server-vs-application-server Web Server 웹서버 점유율 그래프이다. 이 중 nginx나 아파치는 대표적인 오픈소스 웹 서버다. Apache 예전에 생활코딩에서 아파치로 간단한 웹 호스팅 따라 하기 해봤을 때 이렇게 했다. 설치 : bitnami WAMP라는 프로그램 설치 (윈도우 Apache, Mysql, PHP 통합 설치 프로그램) 서버 실행 : 파일 제공 : 브라우저 요청에 따라서 htdocs 디렉토리에 있는 파일 가지고 응답 보냄. (C:\Program Files (x86)\wampstack\apache2\htdocs) URL의 pat..

라는 책에 있는 간단한 이름 등록, 수정, 삭제하는 웹사이트 예제를 분석하면서, 웹의 작동 원리를 이해해 보려고 한다. 웹 초보자라 헷갈려서 가장 큰 골자를 직관적으로 이해할 수 있는 것을 목표로 정리해보려고 한다. 예제 코드 : github.com/ZeroCho/nodejs-book/tree/master/ch4/4.2 ZeroCho/nodejs-book Contribute to ZeroCho/nodejs-book development by creating an account on GitHub. github.com 기본 로직 클라이언트 역할 프로세스 : 브라우저(?) (restFront.js 코드는 이 브라우저 위에서 실행된다. 실행 환경이 브라우저) 서버 역할 프로세스 : restServer (rest..