方式一:
采用jsonp方式实现解决,建议采取这种方式实现。
前端代码:
$.ajax({
type: "POST",
url: "http://*",
data: {
'vCode': vcode
},
dataType:'jsonp',
jsonp:'jsoncallback',
crossDomain: true,
success: function(rs) {
alert(rs.data);
},
error: function() {
}
})
方式二:
采用后台允许相应请求头方式、实现跨域请求。缺点:需后台配置实现允许相应响应头,不灵活。
前端代码:
$.ajax({
type: "POST",
url: "http://*",
data: {
'vCode': vcode
},
dataType: 'json',
xhrFields: {
withCredentials: true
},
crossDomain: true,
success: function(rs) {
alert(rs.data);
},
error: function() {
}
})
}
json请求方式:
$.ajax({
type: "POST",
url: base_url+"/cms/web/bespeak",
contentType: "application/json",
crossDomain: true,
data: JSON.stringify({
'verifyCode': vcode
}),
success: function(rs) {
console.log(rs);
}
});
服务器端设置:
前端方式一:
数据返回形式:jsoncallback(data)
例如:
jsoncallback({"data":"验证失败","errorCode":0,"errorMsg":"success"})
前端方式二:
前端提交数据方式 如是content-type:application/json
服务器需要支持options请求方式,前端设置请求头发出请求,浏览器会发出预请求来进行证书校验。
options(仅需要设置响应头,设置状态码200返回即可)以及真正的请求方式 响应头设置:
Access-Control-Allow-Origin http://*
Access-Control-Allow-Methods GET, POST, PUT, DELETE, OPTIONS
Access-Control-Allow-Credentials true
options 格外添加
Access-Control-Allow-Headers content-type