[WIL-5week] 2021.02.07~02.13

서론

• 02/04~02/10의 주특기 심화 주차가 종료되었습니다.
• 02/11 ~ 02/17 Node.js 미니 프로젝트주차가 시작되었습니다.

일정

• 02/11 (금) 19:00 까지 : S.A. 제출 완료
• 02/12 (토) 오전 : S.A. 서면 피드백 확인
• 02/14 (월) 저녁 : 팀별 프로젝트 중간 멘토링
• 02/16 (수) 저녁 : 5회 항해톡
• 02/17 (목) 저녁 : 팀별 프로젝트 회고 멘토링
• 02/18 (금) 09:00 : 클론코딩 주차 발제

미니프로젝트

• 프론트엔드와 협업을 시작했습니다.
• 자췬 감이필요해 라는 미니 프로젝트를 시작했습니다.

keyworld

• cors

CORS가 필요한 이유!

닫기

 

 

SOP (Same Origin Policy)

• 다른 출처의 리소스를 사용한 것을 제한하는 보안 방식

닫기

출처(origin)란?

url의 protocol, host, port 를 통해 같은 출처인지 다른 출저인지 판단할 수 있다.

 

CORS 탄생 배경

 

CORS(Cross Origin Resource Sharing) 다른 출처의 자원을 공유!!

닫기

교차 출처 리소스 공유(Cross-Origin Resource Sharing, CORS)는 추가 HTTP 헤더를 사용하여, 한 출처에서 실행 중인 웹 애플리케이션이 다른 출처의 선택한 자원에 접근할 수 있는 권한을 부여하도록 브라우저에 알려주는 체제입니다.

 

CORS 접근제어 시나리오

• 예비 요청(Preflight Request) 

닫기

교차 출처 리소스 공유 (CORS) 사전 요청은 본격적인 교차 출처 HTTP 요청 전에 서버 측에서 그 요청의 메서드와 헤더에 대해 인식하고 있는지를 체크 하는 것 입니다.

• 단순 요청(Simple Request)

닫기

대부분 preflight 방식을 사용하지만, 어떤 경우에는 예비 요청없이 본 요청만으로 CORS 정책 위반 여부를 검사하기도 합니다.

1. 요청의 메소드는 GET, HEAD, POST 중 하나여야 한다.
2. Accept, Accept-Language, Content-Language, Content-Type, DPR, Downlink, Save-Data, Viewport-Width, Width를 제외한 헤더를 사용하면 안된다.
3. 만약 Content-Type를 사용하는 경우에는 application/x-www-form-urlencoded, multipart/form-data, text/plain만 허용된다.

• 인증정보 포함 요청(Credentialed Request)

닫기

마지막으로 인증된 요청을 사용하는 방법이다. 이 시나리오는 CORS의 기본적인 방식이라기 보단 다른 출처간 통신에서 좀 더 보안을 강화하고 싶을 때 사용하는 방법이다.

1. same-origin (기본값) : 같은 출처 간 요청에만 인증 정보를 담는다.
2. include : 모든 요청에 인증 정보를 담는다.
3. omit : 모든 요청에 인증 정보를 담지 않는다.

 

 

 

반성과 배운점

• axios의 개념이 부족하여 좀 더 공부해야한다.
• 로그인 인증 미들웨어를 어떻게 적용시킬지 생각해봐야한다.