크로스 도메인 에러 (Cross-Domain 이란?)

 

 XMLHttpRequest cannot load http://localhost:8080/v1/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access.

 

 

javascript의 보안정책 중 하나인 Same-Origin Policy(동일 근원 정책)에 의해

다른 도메인의 서버에 요청하는 것을 보안문제로 간주해 원하는 회신을 받지 못하는데,

 

바로, 웹 사이트 개발 시 주요 이슈 중 하나인 크로스 도메인(Cross-Domain) 이다.

 

웹 브라우저에서 ajax 등을 통해 다른 도메인의 서버 URL을 호출해 데이터를 가져오는 경우,

보안 상의 이유로, 브라우저들은 스크립트 내에 초기화되는 cross-origin HTTP요청을 제한하기 때문이다.

 

해결방안 1) javascript.domain 이용하기

<script>
	document.domain = 'http://sample.com';
</script>

 

해결방안 2) jsonp 이용하기(동일 출처 정책 적용X)

<script src="http://code.jquery.com/jquery-latest.js"></script>

 

해결방안3) CORS(Cross-Origin Resource Sharing) 핸들링

public class CORSFilter extends OncePerRequestFilter {

	@Override
    protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response,
    	FilterChain filterChain) throw ServletException, IOException {
    	reponse.addHeader("Access-Control-Allow-Origin", "*");
        
        filterChain.doFilter(request, response);
    }
}