都知道妇押，解決跨域通信的常用的方式是通過jsonp實(shí)現(xiàn)蕴坪。原理是 通過<script>標(biāo)簽可以獲取任意服務(wù)器資源聚假、不受同源策略限制的特性锦庸。
原生js實(shí)現(xiàn)jsonp:
let src = "https://cnodejs.org/api/v1/topic/5433d5e4e737cbe96dcef312?callback=f";
function f(data) {
console.log(data);
}
function addScriptTag(src) {
let script = document.createElement('script');
script.src = src;
document.body.appendChild(script);
}
window.onload = function () {
addScriptTag(src);
};
報(bào)錯(cuò) Uncaught SyntaxError: Unexpected token :
分析：
<script>加載的內(nèi)容會(huì)被當(dāng)作js代碼執(zhí)行机蔗，json格式的數(shù)據(jù)肯定會(huì)報(bào)錯(cuò)。
解決：
- 修改服務(wù)器端json數(shù)據(jù)甘萧，將json數(shù)據(jù)封裝成函數(shù)萝嘁，如：
callback({
"success": true,
"data": {
})
這樣，返回的數(shù)據(jù)就可以直接調(diào)用扬卷。
注：回調(diào)函數(shù)的名字和服務(wù)器端函數(shù)的名字必須一致Ｑ姥浴！怪得！
- 通過jQuery實(shí)現(xiàn)
$.ajax({
url: src,
dataType: "jsonp",
success: function (data) {
console.log(data);
}
})
