SMALL
Ajax 통신으로 공유하기 버튼을 클릭한 횟수와 공유한 게시글을 통해 유입된 인구수를 조사하기 위해 각각의 php파일을 만들고 서버와 통신을 시도했는데, 아래와 같은 오류를 내보냈다.
Access to XMLHttpRequest at 'https://url/ajax.php' from origin 'https://this\_url/' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
로컬에서 테스트했을 때는 같은 url상의 경로이기 때문에 당연하게 되었던 것이,
실제 경로에 스크립트 삽입 후 url이 바뀌었기 때문에 CORS정책에 의해 막힌다는 것.
사실상 유명무실한 정책인 것 같지만.. 그래도 어쩌겠는가..
방법은 클라이언트 사이드에서 확장도구를 사용하는 방법과, 서버 사이드에서 접근을 허용해주는 방법이 있다.
서버와 웹페이지가 같은 서버경로상에 있다면 굳이 필요 없겠지만 내 경우 여러곳에 배포할 목적으로 사용하는 것이기 때문에 서버 사이드에서 해결해 주도록 한다.
방법은 상당히 심플한데, 헤더에
Access-Control-Allow-Origin: \*
Access-Control-Max-Age: 86400
Access-Control-Allow-Headers: x-requested-with
요것들만 추가해주면 된다는 것..
하지만 저렇게만 하면 GET/POST 메소드 이외에는 사용이 안되기 때문에 다른 메서드를 사용하기 위해 하나 더 추가해준다.
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS
최종적으로 PHP 코드는 이렇게 된다
1 2 3 4 | header('Access-Control-Allow-Origin: *'); header('Access-Control-Max-Age: 86400'); header('Access-Control-Allow-Headers: x-requested-with'); header('Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS'); |
아래에 잘 설명되어있는 글이 있으니 더 알아보고싶다면 참고하도록 하자.
BIG