什么是跨域？
跨域，指的是瀏覽器不能執(zhí)行其他網(wǎng)站的腳本。它是由瀏覽器的同源策略造成的，是瀏覽器對(duì)JavaScript施加的安全限制。
所謂同源是指:域名，協(xié)議，端口均相同，如：
http: //www.123.com:8080
http換https，www換abc，123換456，8080換8081都屬于跨域
請(qǐng)注意：localhost和127.0.0.1雖然都指向本機(jī)，但也屬于跨域。
瀏覽器執(zhí)行javascript腳本時(shí)，會(huì)檢查這個(gè)腳本屬于哪個(gè)頁(yè)面，如果不是同源頁(yè)面，就不會(huì)被執(zhí)行。
解決辦法：
1、JSONP：
script標(biāo)簽src屬性中的鏈接卻可以訪問(wèn)跨域的js腳本，利用這個(gè)特性，服務(wù)端不再返回JSON格式的數(shù)據(jù)，而是返回一段調(diào)用某個(gè)函數(shù)的js代碼，在src中進(jìn)行了調(diào)用，這樣實(shí)現(xiàn)了跨域。但是要注意JSONP只支持GET請(qǐng)求，不支持POST請(qǐng)求。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<input type="text" id="input">
<ul id="ul"></ul>
</body>
<script>
function callBack(obj) {
var array = obj.s;
ul.innerHTML = "";
for (var i = 0; i < array.length; i++) {
var li = document.createElement('li');
li.innerText = array[i];
ul.appendChild(li);
}
}
var ul = document.getElementById('ul');
var input = document.getElementById('input');
input.onkeyup = function () {
var script = document.createElement('script');
// script.src = 'http://suggestion.baidu.com/su?wd=' + this.value + '&cb=callBack';
script.src = 'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=' + this.value + '&cb=' + callBack.name;
document.body.appendChild(script);
// document.body.removeChild(script);
script.remove();
};
</script>
</html>
2、代理：
例如www.123.com/index.html需要調(diào)用www.456.com/server.php，可以寫(xiě)一個(gè)接口www.123.com/server.php，由這個(gè)接口在后端去調(diào)用www.456.com/server.php并拿到返回值，然后再返回給index.html，這就是一個(gè)代理的模式。相當(dāng)于繞過(guò)了瀏覽器端，自然就不存在跨域問(wèn)題。
3、PHP端修改header（XHR2方式）
在php接口腳本中加入以下兩句即可：
header('Access-Control-Allow-Origin:*');//允許所有來(lái)源訪問(wèn)
header('Access-Control-Allow-Method:POST,GET');//允許訪問(wèn)的方式
