通过Ajax读取本地json文件，提示跨域的原因和解决方法

通过Ajax读取本地json文件，谷歌报错提示跨域

本地写有一个 .json 代码文件，然后网页文件使用ajax读取，并用谷歌浏览器打开，发现谷歌报错：提示跨域。

谷歌浏览器控制台报错

但是跨域一般是由于协议、域名、端口中有一个不同，才会跨域，我在本地访问自己的文件，怎么和跨域扯上关系？而使用火狐浏览器打开，数据正常打印出来了，不过提示 XML 解析错误：格式不佳

火狐浏览器控制台

谷歌浏览器报错出现了跨域问题，火狐可以看到数据。这是为什么？

火狐可以正常读取到本地的JSON文件，原因是：虽然允许跨域很不安全，但是如果不跨域的话又带来很多不便。所以火狐是允许跨域的，但也给出了提示。
​

那为什么谷歌会出现跨域的问题？

这里要提一点，访问本地计算机中的文件，使用的是file协议。file协议主要用于访问本地计算机中的文件，就如同在Windows资源管理器中打开文件一样，注意它是针对本地（本机）的，简单来说，file协议是访问你本机的文件资源。

看谷歌控制台报错的原因：

Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

跨源请求只支持协议模式：http、data、chrome、chrome-extension、https

说白了就是，由于安全原因浏览器不允许跨域访问，安全机制认为加载本地其他文件是跨域行为。谷歌浏览器会跨域失败，是因为浏览器安全机制不允许，而火狐为了方便允许跨域(虽然这样很不安全)。而且在其他浏览器中，出现跨域问题也是这个原因，就是浏览器安全机制的原因。

​

为什么谷歌不支持跨域？

这是因为浏览器的安全策略，即禁止ajax访问本地的文件，这是不安全也是不允许的，举例的话，就相当于你访问了一个网站，然后这个网站就可以读取到你本地的文件，这种行为是不允许的。
​

怎么解决跨域问题？

1. 前端人员使用的一般是JSONP进行跨域。
2. 项目中使用nginx反向代理。
3. 修改谷歌浏览器的配置。