Browser Security (CORS, XSS, CSRF)

2020. 12. 28. 15:55Server & Node.js/Node.js & HTTP

브라우저는 다양한 공격을 받을 수 있다. 그 종류를 알아보자

 

 

※ CORS 리뷰 및 적용

다른 origin에서 ex) youtube -> gitHub, 다른 server에 있는 resource 자원을 요청해서 사용. = CORS 요청

개발자들이 cross-domain을 사용할 수 있게 해달라고 요청함.

 

 

 

 

1.

서버가 : codestates.com 
이라는 origin에만 cross origin domain 요청을 허용해주면.

 

 

<-- 얘는 처음에 OPTIONS 라는 preflight requset를 통해서

 

서버에 CORS origin에 대한 request 정보를 확인을 하고
그다음 browser는 자동으로 OPTIONS 요청으로 서버에 보내서
Cross origin 요청에 대한 허가를 받은 다음 그제서야 POST 요청을 보내준다. 

 

OPTIONS === preflight request
->
browser 에서 자동으로 어떤 클라이언트가 어떠한 요청을 다른 origin에 있는 서버에 요청을 할때 
코드스테이츠라는 클라이언트는 서버에 POST요청으로 어떤 header 조건을 갖춘 POST요청을 하게되면 그때 browser가 먼저 OPTIONS라는 methods로 서버에 가서 나는 이런이런 방식으로 POST를 요청할껀데 너희 서버는 허용하고 있니?

서버는 codestates.com이라는 origin을 허용하고 있으니까
서버는 코드스테이츠에게 너희는 우리 서버에 resource 요청을 할 수 있다.
즉, 다시 OPTIONS에 대해서 정상 response(응답)을 보내주고,
그 후에 우리가 클라이언트에 설정해 두었던 POST요청을 서버에 보내서 
resource를 생성하는 방식으로 Cross origin 요청을 하게된다.

그리고! 

 

▶ CORS (Cross-Origin Resource Sharing)

https://developer.mozilla.org/ko/docs/Web/HTTP/CORS

 

Cross-Origin Resource Sharing (교차출처자원을 공유한다.)
보안적인 이유로, 브라우저는 스크립트 내에서 시작한 cross-origin HTTP request 를 제한합니다.

즉, 이 API를 사용하는 웹 애플리케이션은 자신의 출처와 동일한 리소스만 불러올 수 있으며, 다른 출처의 리소스를 불러오려면 그 출처에서 올바른 CORS 헤더를 포함한 응답을 반환해야 합니다.

=> 웹 애플리케이션의 사용자를 보호하기 위한 브라우저만의 자발적인 보안조치

브라우저간의 데이터를 주고받는 과정에서 도메인 이름이 서로 다른 사이트간에 API요청을 할 때, 공유를 설정하지 않으면 CORS 에러가 발생한다.

액세스를 컨트롤하는 예시가 있는데 그것이 바로 simple request preflight request이다.

 

simple request가 사용되는 경우

- GET, HEAD, POST 요청

- 사용자 헤더가 없어야 한다.

- 헤더에서 Content-type이 text/plain, multipart/form-data, application/x-www-form-urlencoded 여야 한다.

 

pre-flight request는 

- 옵션 메서드를 통해서 크로스 오리진으로부터 정보를 받아올  있는지 없는지 미리 요청을 한다.

- 실제 요청이 안전한지 서버가 미리 파악할  있도록 하는 수단이다.

- 실질적인 요청  옵션 메서드를 통해 발생한다.

- 모든 크로스 오리진 요청이 preflight request  발생시키는 것은 아니다. (simple request는 아님)

해결 방법

요청을 주는 쪽의 request 헤더와 요청을 받는 쪽의 response 헤더에 특정 값을 설정하면 된다.

 

 XSS (Cross Site Scripting)

클라이언트가 서버를 신뢰하기 때문에 발생하는 이슈이다.
보안이 약한 웹 어플리케이션에 대한 웹 기반 공격이며, 공격의 희생자는 어플리케이션이 아닌 유저(user)가 된다.
해로운 컨텐츠가 javascript를 활용하여 전달이 되는 것이다.

1. 정상적인  앱에 악성 스크립트를 주입하는 공격이다.

2. 현대 브라우저의 경우 보통 xss 공격에 대한 기본적인 방어는 마련해두고 있다.

3. input 태그  클라이언트에 대한 입력을 통해 발생하는 경우가 많으므로 스크립트를 일반 문자열로 변환하는 필터 장치를 마련하여 예방할  있다.



 CSRF (Cross-Site Request Forgery)

서버가 클라이언트를 신뢰해서 발생하는 이슈
서버는 인증정보를 가지고 오면 믿는다. 

해커가 피싱 페이지에 접속한 피해자의 인증정보를 가로채 공격하는 방법.

'Server & Node.js > Node.js & HTTP' 카테고리의 다른 글

HTTP 메소드  (0) 2020.12.29
HTTP  (0) 2020.12.28
Package.js  (0) 2020.12.27
Node.js  (0) 2020.12.27