今天写表单提交时候遇到个问题, 每次提交都提示是跨域的问题,捣鼓了半天,发现少了个属性
后台的跨域设置:
前台form表单提交:
解决方式: 在表单提交时候加2个属性
访问正常
解决跨域请求问题,首先了解什么是跨域
跨域请求用于什么环境?解决方式?
跨域指浏览器不能执行其他网站的脚本,是由于浏览器的同源策略造成的,浏览器施加的安全策略; 同源是网络协议,域名,端口均相同
网络协议,域名,端口只要有一个不同,即为跨域
如:
请注意:localhost和127.0.0.1虽然都指向本机,但也属于跨域。
1. 使用jsonp解决跨域, ajax请求使用jsonp(发送请求是datatype:'jsonp')
但是要注意JSONP只支持GET请求,不支持POST请求。
2. 使用cros实现跨域调用 ,Cross-Origin Resource Sharing(CORS)跨域资源共享是一份浏览器技术的规范
response.setHeader("Access-Control-Allow-Credentials", "true");
response.setHeader("Access-Control-Allow-Origin", request.getHeader("origin"));
response.setContentType("application/x-javascript");
注: 使用后者时注意前台ajax提交时注意设置参数: xhrFields: {withCredentials: true},
它指示了是否该使用类似cookies,authorization headers(头部授权)或者TLS客户端证书这一类资格证书来创建一个跨站点访问控制(cross-site Access-Control
)请求。在同一个站点下使用withCredentials属性是无效的。(默认值是false)
也会被用做响应中
cookies 被忽视的标示。对同源请求没有影响
如果使用的option方式, 则需要添加另一个属性: crossDomain: true,即
var option = {
url: "url", //form提交数据的地址
type: 'post', //form提交的方式(method:post/get)
dataType: 'json', //服务器返回数据类型
target:'#ssss', //服务器返回的响应数据显示在元素(Id)号确定
xhrFields: {withCredentials: true},
crossDomain: true,
success: function (data) {}
}
$("#form").ajaxForm(option)
crossDomain主要是用于cors跨域ajax请求时使用的,这种跨域支持post等请求,需要服务端支持,返回的内容可以是标准的json。
json是一种数据格式,而jsonp属一种数据交互方式