동일출처정책과 CORS 그리고 해결 방법

동일출처정책(Same-Origin Policy)

- 같은 도메인과 포트에서 들어온 요청에 대해서만 접근을 허용

 

CORS(Cross-Origin Resource Sharing)

- 동일출처(도메인과 포트)가 아닐 시 요청의 응답을 거부한다. 보통 Ajax 호출 시 많이 보게 된다.

 

Preflight Request

- HTTP Header에 options를 이용하여 먼저 요청을 보낸 후 서버에서 응답이 가능한 지 확인 후 원래 요청을 다시 보내는 방식이다.

---

해결 방법

 

1) Access-Control-Allow-Origin헤더 추가

서버에서 응답(response)를 보낼 시 해당 헤더를 추가하는 방식이다.

서버에서 작업해야되며 스프링에서는 @CrossOrigin이라는 어노테이션을 이용하여 Controller 또는 메서드에 추가하여 간단하게 해결할 수 있다.

 

2) Proxy를 이용, 별도의 프로그램으로 접근

Ajax의 CORS는 브라우저에 국한되어 동작한다. 즉 브라우저에 직접 해당 URL 입력 시에는 문제없이 동작 한다.

이를 이용하여 Proxy형식으로 별도의 프로그램을 제작하여 url을 직접 접근해 가져오는 방식이다.

별도의 프로그램을 제작해야 되기 때문에 1번 방식에 비해 번거롭다.

 

3) JsonP(Json with Padding)

js의 일부를 받아와 실행시키는 방식이다. Ajax의 형태를 흉내낸 방식이지만 동작 자체는 완전 다르다.

서버에 <script>를 호출하여 실행시키는 우회방식 중 하나이다. 이 방식도 서버에서 추가적인 작업이 필요하며

jQuery에서 지원해 주고 있기 때문에 간편하게 이용가능하다.

단점으로는 POST방식의 호출이 불가능하다