javascript的同源策略以及jsonp请求百度天气接口
一段脚本只能读取来自于同一来源的窗口和文档的属性,这里的同一来源指的是主机名、协议和端口号的组合
协议 : http,ftp
主机名 : localhost
端口名:http协议的默认端口80:
https:默认端口是8083
同源策略带来的麻烦:ajax在不同域名下的请求无法实现,
如果说想要请求其他来源的js文件,或者json数据,那么可以通过jsonp来解决
第一种方法:
所以列举以下例子利用回调函数
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
<script>
function aa(data){
console.log(data)
}
</script>
<script src="http://api.map.baidu.com/telematics/v3/weather?location=北京&output=json&ak=H7W5CxI0BPzKtwGcBHmpGPAz50xP1Qjw&callback=aa"></script>
<script src="jquery.js"></script>
</html>
第二种方法:
所以列举以下例子利用jquery.js下封装的ajax方法实现对天气借口调用与实现
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
</body>
<script src="jquery.js"></script>
<script>
$.ajax({
url:"http://api.map.baidu.com/telematics/v3/weather?location=北京&output=json&ak=H7W5CxI0BPzKtwGcBHmpGPAz50xP1Qjw",
dataType:"jsonp",
jsonpCallback:"admin_cross",
success:function(data){
console.log(data)
}
})
</script>
</html>