web

CORS(Cross Origin Resource Sharing)

codeManager 2022. 6. 17. 18:20
반응형

HTTP 요청은?

기본적으로 Cross-Site HTTP Requests가 가능하다.

예를 들어 <img> 태그로 다른 도메인 이미지를 가져오거나 <link> 태그로 다른 도메인의 css를 가져오거나, <script> 태그로 다른 도메인의 JavaScript 라이브러리를 가져오는 것이 가능하다

하지만<script></script> 로 둘러싸여 있는 스크립트에서 생성된 Cross-Site HTTP Requests는 Same Origin Policy를 적용받아서 Cross-Site HTTP Request가 불가능하다.

 

Same Origin Policy를 하는 이유?

attacker가 웹사이트에 script를 심어놓는 것을 방지하기 위해서다.

 

AJAX가 널리 사용되면서 <script></script>로 둘러싸여 있는 스크립트에서 생성되는 XMLHttpRequest에 대해서도 Cross-Site HTTP Request가 가능해야 한다는 요구가 생기자 W3C에서 CORS라는 이름의 권고안이 나왔다.

 

 

CORS를 사용하려면?

- 클라이언트에서 Access-Control-** 종류의 HTTP Header를 서버에 보내야 한다.

- 서버도 Access-Control-** 종류의 HTTP Header를 클라이언트에 회신하게 되어 있어야 한다.

 

결론

 CORS를 쓰면 AJAX로도 Same Origin Policy의 제약을 넘어 다른 도메인 자원을 사용할 수 있다.

 

 

 

참고

http://homoefficio.github.io/2015/07/21/Cross-Origin-Resource-Sharing/

 

Cross Origin Resource Sharing - CORS

개요HTTP 요청은 기본적으로 Cross-Site HTTP Requests가 가능하다. 다시 말하면, <img> 태그로 다른 도메인의 이미지 파일을 가져오거나, <link> 태그로 다른 도메인의 CSS를 가져오거나, <script> 태그로 다른

homoefficio.github.io

 

반응형