Chrome 62/Chrome Canary 64 中的 ES6 模块支持，在本地不工作，CORS 错误
Posted
技术标签:
【中文标题】Chrome 62/Chrome Canary 64 中的 ES6 模块支持，在本地不工作，CORS 错误【英文标题】：ES6 module support in Chrome 62/Chrome Canary 64, does not work locally, CORS error 【发布时间】：2018-04-10 02:06:09 【问题描述】：索引.html
<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';
错误：从源“null”访问“file:///C:*******/es6/code.js”处的脚本已被 CORS 策略阻止：响应无效。因此不允许访问 Origin 'null'。
Chrome 说它可以支持模块，并且我已经看到了在网络上运行的示例，但是当我将它们复制下载并在本地运行它们时，我总是收到上述错误。我不想使用 Babel、Webpack 等。
我已尝试在 Chrome 和 Chrome Canary 中启用 Experimental Web Platform features 标志。
【问题讨论】：
【参考方案1】：与常规脚本不同，ES6 模块受same-origin policy 约束。这意味着您不能从文件系统中import 它们或在没有 CORS 标头的情况下跨域（无法为本地文件设置）。
基本上，您需要从（本地）服务器运行此代码或在浏览器中禁用同源进行测试（不要永久这样做）。见：Access to Image from origin 'null' has been blocked by CORS policy。
【讨论】：
谢谢亚历山大！！！知道如果我尝试使用电子会发生什么吗？ @markpavlis 我猜 Electron 没有这样的安全限制，但我不确定。 另外：导入模块时，指定模块位置的字符串称为“模块说明符”或“导入说明符”。查看有效和支持的模块说明符（来自 './lib.mjs' 是有效的，但不是来自 'lib.mjs'）。检查：developers.google.com/web/fundamentals/primers/modules 即将允许使用不同的说明符。 有用，花了一天时间寻找我的模块无法加载的原因后，我从本地节点服务器运行代码。结果。没有人在 JS 领域指出这一点显而易见但又容易被忽视 :-) 如果你没有时间设置本地服务器，你可以简单地使用：chrome.google.com/webstore/detail/web-server-for-chrome/…【参考方案2】：我遇到了同样的问题，尝试导入 es6 代码以在浏览器的 html 文件中启动，在浏览器控制台中出现 CORS 错误。如果您的机器上有 python，那么创建本地服务器的一种简单方法是：
python3 -m http.server 8001
从您正在工作的文件夹中。
【讨论】：
以上是关于Chrome 62/Chrome Canary 64 中的 ES6 模块支持，在本地不工作，CORS 错误的主要内容，如果未能解决你的问题，请参考以下文章
[从0到1 CTFer]6.3.2 stack2 canary绕过实验
升级到Canary 6后，在API 16 AVD上运行Kotlin项目的ResourceNotFoundException
Chrome94 发布，多项新特性！开发者工具汉化Network支持反向筛选