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>