使用chrome进行本地文件的请求会报跨域错误

在进行本地json文件获取的时候,惊奇的发现,mmp,竟然报跨域???

跨域的原因于同源策略有关,什么是同源策略?

端口、域名、协议有一个不同即为跨域,浏览器出于安全性的考虑,会利用同源策略防止跨域的从产生。那我请求我本地的文件为什么会报跨域呢。

原来是有一个file协议,应该是访问本地文件的一个协议,这样其实也可以解释为什么会报跨域,协议不同嘛。

但是我试了火狐,火狐只报了json的格式有问题,却没有报同源,请求到的json也是可以正常打出来的。

那么既然协议不同,该怎么解决呢?

既然用到了file协议,就得想办法绕过这个file协议,webstorm这个EDI确实是个好东西,他在你本地代码启动的时候,可以隐的返回一个服务器,这样一来就避免了file协议,可以顺利的访问到本地的json文件。(不上图了)

 

回到跨域,那么怎么解决跨域问题呢?

实现跨域的方法有很多:

1、jsonp

jsonp原理相对简单,就简单理解一下,jsonp主要是利用了script标签可以跨域的功能,通过在script中添加回调的方式,将需要请求的json文件进行回显。

实现:

 

在script标签中,添加回调和需要请求的json文件(注意文件路径)

然后在本页中另起一个script标签,里边添加我们需要的回调test!!!!(我也不知道为啥要在和跨域本页中添加回调,引入js文件我试了,但是失败了,跪求大佬指教)

还有很重要的一个就是,我们json文件的格式!!!比较不和常理(我也不理解,求大佬指教)

得指定一个名字,然后将其他的数据用(小括号)包起来,我觉得应该是需要将这个当作参数返回,所以才使用这样的格式。

然后就会发现,实现了跨域,绕过了file协议

  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值