js加载文件跨域报错cross origin requests...
本地Ajax跨域报错Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
照着教程使用D3来加载 json文件和csv文件时,发现并不能成功加载,会报下面这样的错误。
因为之前遇到过,大概知道原因在于使用了File协议,应该使用它提示的http, data, chrome, chrome-extension, https这些协议,可是只是写几个小Demo,不至于自己去创建一个服务器,开个端口吧。经过各方检索,发现了如下几种解决方案。
1.换编辑器T_T
使用webstorm或是visual studio这种重量级的IDE的同学,应该不会遇到这种问题,这类IDE都内置了HTTP服务器。
但是对于博主这种喜欢VSCode,sublime这类轻量级编辑器的人,还是想找一下别的解决方案。
2.安装Server插件: )
这里针对VSCode和Sublime安利一款插件。
VSCode
Live Server插件,这个插件功能十分强大,不止可以解决ajax不支持file协议的问题,还可以实现在编辑器里保存修改后,页面自动刷新的功能。具体使用方法在插件安装的地方有说明,用起来也十分简单。
安装完成之后,打开html文件后,点击右下角的GoLive 即可。
Sublime
SublimeServer插件,安装完成之后,点击Tools->SublimeServer->Start SublimeServer,启动服务器,然后在html文件中,注意是文件中点击右键,选择 View in SublimeServer即可。
(注意一定要以文件夹的方式打开html文件所在目录,否则可能失效。)
3.换浏览器T_T
火狐支持file协议,对Chorme没有什么执念的童鞋,可以换成火狐。
4.配置Chrome浏览器支持file协议
对于想博主这样很喜欢Chrome开发者工具的人,也可以尝试这种方式。
Windows:
设置Chrome的快捷方式属性,在“目标”后面加上–allow-file-access-from-files,注意前面有个空格,重新打开Chrome即可。
Mac:
打开终端,输入下面命令:open -a “Google Chrome” –args –disable-web-security然后就可以屏蔽安全访问了[ –args:此参数可有可无]
PS
只是更改浏览器配置使之支持file协议,还是有很大的局限性的,建议最好采用前两种方式,配置http服务器才是长久之计~
标签:
相关文章
-
无相关信息