首先得明白,为什么会存在跨域请求数据的问题。在实际大的项目开发中,数据并不全是来源于本机的服务器,很多时候要进行跨域请求数据。而js的同源策略是不允许跨域请求数据的,这样就造成了一种矛盾。于是乎,聪明的开发人员想出了一种利用js可远程加载其它服务器脚本文件的“漏洞”,创造性地提出了一种非官方的跨域请求协议——jsonp。当然,jsonp只是解决跨域请求中的一种办法,还有一种则需要依赖服务器方,在服务器资源方对请求设置白名单后,请求方还需要在请求头中设置请求秘钥
$.ajax({
type:"get",
url: "#######",
dataType:"jsonp",
data:param,
jsonp:"jsoncallback",
jsonCallback:"callback",
contentType: "application/json;utf-8", /*设置返回类型*/
success: function (data) {
if (data.errorCode) {
alert("查询失败。错误码:" + result.errorCode);
return;
}
alert(data)/*在控制台看亦可*/
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("查询失败");
}
});
{
total: 5,
pageData: [
{
id: 5,
mid: 1681121,
makerName: "renhongqiang",
ctime: 1471072397000,
mark: "gsdfg",
status: 1
},
{
id: 4,
mid: 525161,
nickname: "不老的少年",
makerName: "renhongqiang",
ctime: 1470987916000,
mark: "",
status: 0
}
]
}
这个时候就很蛋疼了,显然此种类型是无法对分页进行支持的(不支持分页就不好处理数据),也不支持jsonp,没有其他办法,毕竟你要请求别人的数据,你得按照别人要求的来。于是乎,你要想得到别人的数据,你就得老老实实给出自己的域名并让服务方加入白名单中,倘若还有appkey的验证,则把appkey加入到请求头中。具体如下:
$.ajax({
type:"get",
url: "http://cheat.Bilibili.co/exception_reports?type=mid",
data:{"id":mid},
beforeSend:function(xhr){
xhr.setRequestHeader("Secret","b71ff74c7835fb9");//设置请求头
},
success: function (data) {
if (data.errorCode) {
alert("查询失败。错误码:" + result.errorCode);
return;
}
result = data;
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("查询失败");
}
});
$.ajax({
type: "GET",
url: "http://xxxi.co/api/uploaders/coin_status",
cache: false, //禁用缓存
data: param, //传入已封装的参数
dataType: "json",
success: function (data) {
if (data.errorCode) {
alert("查询失败。错误码:" + result.errorCode);
return;
}
var returnData = {};
returnData.draw = data.draw;
returnData.recordsTotal = data.total;
returnData.recordsFiltered = data.total;
returnData.data = data.result;//此处对传回的数据进行了分页处理
//调用DataTables提供的callback方法,代表数据已封装完成并传回DataTables进行渲染
//此时的数据需确保正确无误,异常判断应在执行此回调前自行处理完毕
callback(returnData);
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("查询失败");
}
});