4

Index.html을ES6 모듈 지원, CORS 오류

<html> 
    <head> 
    <script type="module"> 
     import {answer} from './code.js' 
     console.info("It's ${answer()} time!") 
    </script> 
    </head> 
    <body> 
    </body> 
</html> 

code.js

export function answer(){ 
    return 'module'; 
} 

Error: Access to Script at 'file:///C:*******/es6/code.js' from origin 'null' has been blocked by CORS policy: Invalid response. Origin 'null' is therefore not allowed access.

크롬은 모듈을 지원할 수 말한다 웹에서 작업하는 예제를 보았지만 다운로드 한 파일을 복사하여 로컬에서 실행하면 항상 위의 오류가 발생합니다. Babel, Webpack 등을 사용하고 싶지 않습니다.

Chrome 및 Chrome Canary에서 실험용 웹 플랫폼 기능 플래그를 사용하도록 설정했습니다.

답변

5

일반 스크립트와 달리 ES6 모듈은 same-origin policy의 영향을받습니다. 즉 CORS 헤더없이 (로컬 파일에는 설정할 수 없음) 파일 시스템이나 교차 출처에서 해당 파일을 import 수 없습니다.

기본적으로 (로컬) 서버에서이 코드를 실행하거나 테스트를 위해 브라우저에서 동일한 출처를 사용하지 않도록 설정해야합니다 (영구적으로하지 마십시오). 참조 : Access to Image from origin 'null' has been blocked by CORS policy.

+0

감사합니다. Alexander !!! 전자를 사용하려고하면 어떤 생각이 들겠습니까? –

+0

@markpavlis 나는 Electron이 그런 보안 제한을 가지고 있지 않다고 생각 하겠지만, 나는 확실히 모른다. –