简单请求和非简单请求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请求到服务端