발생한 경위

초보의 초보로 입문편의 참고서를 보면서 공부하고 있어,
Ajax에서 로컬 파일을 호출하려고했지만 CORS 정책 오류로 인해 실패했습니다.

전제

브라우저에서 로컬 파일(html)을 표시한 것뿐.

사용 브라우저는 chrome.

OS는 mac.

오류 내용

Ajax를 실행 한 결과 다음과 같은 오류가 발생했습니다.

'[ファイル名]' from origin 'null' has been bloc
ked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https

CORS policy ???

너무 짜증나는 CORS policy

CORS란?

Cross-Origin Resource Sharing(오리진 간 리소스 공유)
오리진의 구성 요소는 체계, 호스트, 포트.

예를 들면

①　http://qiita.com/users?char=A
②　http://qiita.com/users?char=B
③　http://qiita.com/users?char=C:80
④　http://qiita.com/users?char=D:8080

①~③은 스킴(http), 호스트(qiita.com), 포트(:80)가 동일(80번 포트는 기본)이므로 동일 오리진이라고 할 수 있다.
④는 포트가 다르기 때문에 다른 오리진.

CORS policy란?

CORS policy (동일한 오리진 정책)
한마디로 보안을 위해 같은 오리진에서 밖에 취득하지 않는다는 제약.
이번에는 크롬에서 로컬 파일 서버에 액세스하려고했기 때문에이 제약에 걸렸다.

대응 방법

여러가지 있지만 가장 간단(소스에의 가필등이 불필요)인 것은 브라우저 기동시에 CORS를 허가해 버리는 것.
즉, 다른 오리진으로부터도 액세스 할 수 있도록 해 버리는 것.

chrome 종료 (not 닫기)


다음 명령을 터미널 등에서 실행합니다.

open -a Google\ Chrome --args -allow-file-access-from-files

브라우저 위쪽에 경고문이 나온다.
그래서 Ajax에서 로컬 파일을 부르면 ... 부를 수 있습니다! !

주의점

즉, 다른 오리진으로부터도 액세스 할 수 있도록 해 버리는 것.

이번은 로컬로 닫은 이야기입니다만 외부로부터의 액세스를 허가해 버리고 있기 때문에 시큐러티는 가바가바입니다.
타인의 PC나 공유 PC 사용 시에는 주의가 필요합니다.
물론 사용 PC에서 조금 공부하고 있다는 사람도 요주의입니다.

우리 초보의 인간에게는 모르는 위협이 죄송합니다.
자세한 사람에게 물어봅시다.
그리고 자신의 지식도 늘려 버립니다.

자세한 내용을 알고 싶은 분은

크롬이 아니라 모질라 사이트 (이것은 이해하기 쉽다)
htps : //로 ゔぇぺぺr. 모잖아. 오 rg / 그럼 / cs / u b / Ht tP / RS