欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

ES6实现模块化时遇到的跨域问题(module)

程序员文章站 2022-05-20 19:49:57
...

ES6实现模块化时遇到的跨域问题(module)

1.HTML代码

  <script src="aaa.js" type="module"></script>
  <script src="bbb.js" type="module"></script>
  <script src="mmm.js" type="module"></script>

2.浏览器打开报错

ES6实现模块化时遇到的跨域问题(module)
3.根据内容翻译

访问脚本文件:aaa.js“from origin”null已被CORS策略阻止:跨源请求仅支持协议方案:http、data、chrome、chrome扩展、https。

4.原因

HTML使用type="module"会默认产生跨域请求,我们是在本地打开的文件,而file协议并不支持

5.解决方案

  1. Visual Studio Code下载Live Server 插件

ES6实现模块化时遇到的跨域问题(module)

  1. 在对应.html文件点击右键选择Open with Live Server

ES6实现模块化时遇到的跨域问题(module)
6.结果

可以成功的访问到.js文件并在控制台输出响应内容

ES6实现模块化时遇到的跨域问题(module)

相关标签: es6/es7 vue