$.ajax() 같은 ajax 관련 함수를 호출할 때 타겟이 되는 URL이 클라이언트와 다른 도메인이면 호출이 안 된다.
가령 http://a.abc.com/first.jsp 에서 ajax로 http://x.xyz.com/api/getme 라는 API를 호출할 수는 없다는 말이다.
이는 Same Origin Policy 라는 ajax의 원칙 때문으로, 현재 브라우저에 보여지는 HTML을 내려준 서버에게만 ajax 요청을
할 수 있다는 말이 되겠다.
위와 같이 불가한 호출을 하고 크롬에서 F12를 눌러 에러메시지를 보면,
XMLHttpRequest cannot load http://x.xyz.com/api/getme. Origin http://a.abc.com is not allowed by Access-Control-Allow-Origin.
이라는 문구가 뜨는 걸 볼 수 있다.
이를 해결하는 방법이 있다.
1. json 대신 jsonp 타입을 사용한다.
이때 중요한 것은 type을 get으로 해야 한다는 것이다.
jsonp는 post를 지원하지 않고 get만 가능하기 때문이다. (post로 해 놔도 호출시점에 get으로 바뀐다)
물론 서비스를 제공하는 서버 측에서 해당 api가 get으로 호출가능하도록 되어있어야 한다.
2. CORS 라는 방법을 사용하는 것이다. 이것은 클라이언트가 아닌 서버 측에서 설정해 줘야 하는 것이다.
즉 다른 도메인과도 ajax 통신을 할 수 있도록 서버에 설정하는 것이다.
관련 포스팅 (http://iolothebard.tistory.com/494) |
'소프트웨어 > JavaScript' 카테고리의 다른 글
JQuery Validation (0) | 2013.10.01 |
---|---|
jQuery Migrate plugin (0) | 2013.08.19 |
Custom Scheme 만들기(모바일 웹 -> 앱 실행) (0) | 2013.08.07 |
Jquery+Ajax으로 session 생성하기 (0) | 2013.08.07 |
jquery 기본 (0) | 2013.08.07 |