简单请求和非简单请求1
1、浏览器发送跨域请求,如何判断?
浏览器在发送跨域请求的时候,会先判断下是简单请求还是非简单请求,如果是简单请求,就先执行服务端程序,然后浏览器才会判断是否跨域
2、简单请求
(1)工作中比较常见 【简单请求】:
方法为:GET
HEAD
POST
(2)请求header里面:
无自定义头
Content-Type为以下几种:
text/plain
multipart/form-data
application/x-www-form-urlencoded
3、非简单请求
工作中常见的【非简单请求】有:
put,delete方法的ajax请求
发送json格式的ajax请求
带自定义头的ajax请求
4、POST JSON请求
(1)postJson请求出现了跨域问题
postJson请求出现了跨域问题
(2)前端代码
index.html代码
// 测试jsonPost方法
it("测试jsonPost方法", function(done) {
//服务器返回的结果
varresult;
$.ajax({
url:base +"/postJson",
dataType:"json",
type:"post",
contentType:"application/json;charset=utf8",
data:JSON.stringify({name: "postJson wwl"}),
success:function(json){
result= json;
}
});
//由于是异步请求,需要使用setTimeout来校验
setTimeout(function(){
expect(result).toEqual({
"data": "postJson wwl"
});
//校验完成,通知jasmine框架
done();
},100);
});
(3)后端代码
AjaxController代码
@PostMapping("/postJson")
@ResponseBody
public ResultBean postJson(@RequestBody User user){
System.out.println("AjaxController.postJson()");
ResultBean resultBean = new ResultBean(user.getName());
return resultBean;
}
5、解决POSTJSON请求跨域问题
(1)出现了跨域问题
出现了跨域问题
(2)后端在响应头中添加Access-Control-Allow-Headers字段
添加Access-Control-Allow-Headers字段
res.addHeader("Access-Control-Allow-Headers", "Content-Type");
(3)验证是否解决跨域
这里有两个postJson请求:
OPTIONS表示预检命令,如果预检通过之后,才会发送POST请求到服务端
验证成功,没有出现跨域报错信息
这里只有一个postJson请求,因为后台程序没有在响应头里添加res.addHeader("Access-Control-Allow-Headers", "Content-Type")字段
OPTIONS预检未通过,就不会发送POST请求到服务端
OPTIONS预检未通过,就不会发送POST请求到服务端