学习笔记——使用ajax()方法解决跨域问题

        最近在FCC做任务的时候，任务中需要使用网上提供的接口完成通过Ajax获取到JSON数据，来动态更新页面上的天气情况。参考了下别人使用的天气预报接口，最后选择了和风天气。对其进行数据请求之后，成功获取了天气预报的数据返回。

        使用方法：$.getJSON(url,function(data){ //data为返回的数据}); 

        //url是接口地址（例如和风天气里面的接口地址是 https://free-api.heweather.com/v5/weather?city=yourcity&key=yourkey）

        特别方便有没有？然后完成了对天气数据的获取，就到了对所在城市的位置获取，我选择了使用百度地图API来获取。百度地图提供的功能有点多，像我这种新手看起来，就感觉有点摸不清头脑。不过相同点是，你得先有个账号，然后获得API的密钥（key）。天气定位不需要太精确的位置，所以选用了Web服务API中的普通IP定位API。（有点想吐槽的一点是，百度地图的定位，有时候居然能偏差超级多，我在广东，居然有时候能定位到浙江。。。）

        然后准备使用和前面获取天气预报数据一样的getJSON方法，然后就有问题出现了：浏览器报错了。

        于是又屁颠屁颠的去找度娘了，慰问完度娘，才知道，这是和安全机制有关，不允许跨域调用。可以使用ajax()方法来执行。放一下菜鸟教程里面对ajax方法的描述（表示已经默默记住了）：

        放一下处理代码：

$.ajax({
	url:"https://api.map.baidu.com/location/ip?ak=yourak", //接口地址，yourak是你的API key
	type:"GET", //规定请求的类型（GET 或 POST）。
	dataType:"JSONP", //预期的服务器响应的数据类型。
	success:function(localData){
		console.log(localData.content.address_detail.city); //成功输出请求的数据
	}
});

        忍不住，最后再吐槽一次获取的定位，我不在浙江。。。

        最后的最后跟一张正常不抽风状态下的图：