最近在使用360浏览器进行前端开发时遇到了一个问题,就是当我使用ajax进行静态请求json的时候,会报错。
$.ajax({ url: './test.json',type: 'GET',dataType: 'json',success: function(data) { console.log(data); },error: function(xhr,status,error) { console.log(error); } });
在谷歌、火狐等浏览器中,这个ajax请求是可以正常运行的,返回的也是我想要的json数据。然而在360浏览器中,就会报错,提示:JSON格式有误。
经过查看360浏览器的官方文档,发现这个问题是由于360浏览器的一项安全策略引起的。这项安全策略要求所有的jsonp与json请求必须返回一个ContentType的头。而由于我们的请求是静态的,因此就无法返回相应的ContentType头,导致了错误的发生。
header('Content-type: application/json'); echo json_encode($result);
为了解决这个问题,我们可以通过在请求头中加入一个contentType的头信息来解决这个问题。
$.ajax({ url: './test.json',headers: { "Content-Type": "application/json" },error) { console.log(error); } });
这样就可以在360浏览器中成功获取到相应的json数据了。
总之,我们在进行前端开发时,要时刻注意浏览器的差异性,以免出现一些不必要的问题。