跨域查询接口的数据，之前在公司时有发生过，产生的原因是，本地请求的域名或IP地址不一致，解除方法，也是修改域名和IP地址。比如：
接口中的数据来自IP地址：192.168.1.23/get.php
如果本地调用这个接口中的数据，必须要修改你的请求地址也同样为 192.168.1.23/get.php
通常的做法是将接请求地址组合为一个对象和一个方法，通过调用这个方法来调用接口：
/*查询接口*/var config = {
"protocol":"http",
"server":"oliveche.com",
"virtualDirectory":"quiz/api.php"
};var getBaseUrl = function(){
return config.protocol + "://" + config.server + "/" + config.virtualDirectory + "/";
}
最近在做一个笔记时，因为也是调用别人的接口，而产生了跨域，即使在本地更改了请求的域名或IP地址也不能直接使用 $.ajax({})中的get或post，会直接报跨域请求失败，解决的办法是使用 ：$.ajaxSetup()
首先了解一下这个方法 $.ajaxSetup()，为所有 AJAX 请求设置默认 URL 和 success 函数，它的语法是：
jQuery.ajaxSetup( settings )
什么意思呢？settings 是一个对象，其中的每个属性表示需要更改默认设置的选项，而它的属性值表示更改后的默认值：
//需要更改的属性：更改后的默认值
key : value
下面是我使用$.ajaxSetup()的使用示例方法：
$(function(){
//查询方法
searchData();
});function searchData(){
$.ajaxSetup({
url: getBaseUrl() + "Quiz.get", // 默认URL
type: "GET" , // 默认使用GET方式
success:function(result){ //result 是查询接口中返回的数据
//你的数据逻辑方法
},
error:function(){}
});
//这里调用$.ajax()方法时，已经被$.ajaxSetup中的属性 success 返回了正确的结果
$.ajax();
}
下面是官方文档中摘抄到的示例方法：
//设置AJAX的全局默认选项
$.ajaxSetup( {
url: "/index.html" , // 默认URL
aysnc: false , // 默认同步加载
type: "POST" , // 默认使用POST方式
headers: { // 默认添加请求头
"Author": "CodePlayer" ,
"Powered-By": "CodePlayer"
} ,
error: function(jqXHR, textStatus, errorMsg){ // 出错时默认的处理函数
// jqXHR 是经过jQuery封装的XMLHttpRequest对象
// textStatus 可能为： null、"timeout"、"error"、"abort"或"parsererror"
// errorMsg 可能为： "Not Found"、"Internal Server Error"等 // 提示形如：发送AJAX请求到"/index.html"时出错[404]：Not Found
alert( '发送AJAX请求到"' + this.url + '"时出错[' + jqXHR.status + ']：' + errorMsg );
}
} );// 未设置任何参数，但url、async、type、headers、error等参数的默认值均已被$.ajaxSetup()更改(如上)
$.ajax( );// 设置了url、type、success、error，就使用自己设置的参数值
// 但async、headers等参数的默认值已被$.ajaxSetup()更改
$.ajax( {
url: "myurl.php?action=list" ,
type: "GET" ,
success: function( data, textStatus, jqXHR ){
alert("返回数据：" + data);
} ,
error: function(jqXHR, textStatus, errorMsg){
alert("自己的error!");
}
});// 上述$.ajaxSetup()的默认设置对$.get()、$.post()、load()、$.getJSON()、$.getScript()等AJAX函数也生效
// 因为这些函数也是在内部调用$.ajax()函数来实现的，只不过它们在内部都设置了一些参数// $.get()在内部调用$.ajax()时已设置type为"GET"，因此仍然使用GET方式。
// 但url、async、headers、error等参数的默认值已被$.ajaxSetup()更改
$.get( );// $.post()在内部调用$.ajax()时已设置type为"POST"，因此仍然使用POST方式。
// url也被设置为"user/action.php?method=addUser"
// 但async、headers、error等参数的默认值已被$.ajaxSetup()更改
$.post( "user/action.php?method=addUser" );
总之，我们的目的是在使用$.ajax({})时不管使用get还是post，接口中的数据是不存在跨域的就OK。
需要注意的是用$.ajaxSetup函数所设置的默认值不会应用到load()命令上。对于实用工具函数，如$.get()和$.post()，其HTTP方法不会因为使用这些默认值而被覆盖。设置GET的默认类型不会导致$.post()使用HTTP的GET方法。
<script type="text/javascript">
$().ready(function () {
var show = $('#show');
$('#selectNum').change(function () {
var idValue = $(this).val();
$.get('Server.aspx', { id: idValue }, function (data) { show.append(data+'<br/>'); });
}); $.ajaxSetup({
timeout: 3000,
dataType: 'html',
//请求成功后触发
success: function (data) { show.append('success invoke!' + data + '<br/>'); },
//请求失败遇到异常触发
error: function (xhr, status, e) { show.append('error invoke! status:' + status+'<br/>'); },
//完成请求后触发。即在success或error触发后触发
complete: function (xhr, status) { show.append('complete invoke! status:' + status+'<br/>'); },
//发送请求前触发
beforeSend: function (xhr) {
//可以设置自定义标头
xhr.setRequestHeader('Content-Type', 'application/xml;charset=utf-8');
show.append('beforeSend invoke!' +'<br/>');
},
})
})
</script>
