zoukankan      html  css  js  c++  java
  • Ajax需要带头信息跨域问题的解决

     1 $.ajax({
     2       type:"get",
     3       url:"http://localhost:8082/index/getMsg",
     4       dataType:'json',
     5       headers: {
     6         "Content-Type": "application/x-www-form-urlencoded",
     7         "token":"token"
     8       },
     9 
    10       success:function(data){
    11         console.log(data)
    12         if(data.status == "0"){
    13           //登录成功
    14         }else {
    15           alert(data.msg)
    16         }
    17       },
    18       error:function(data){
    19         console.log(data)
    20       }
    21 
    22     });

    前端代码

    "Content-Type": "application/x-www-form-urlencoded",是必填项

    response.setHeader("Access-Control-Allow-Origin", "*");
            String token = request.getHeader("token");
           // System.out.println("filter origin:"+token);//通过打印,可以看到一次非简单请求,会被过滤两次,即请求两次,第一次请求确认是否符合跨域要求(预检),这一次是不带headers的自定义信息,第二次请求会携带自定义信息。
            if ("OPTIONS".equals(request.getMethod())){//这里通过判断请求的方法,判断此次是否是预检请求,如果是,立即返回一个204状态吗,标示,允许跨域;预检后,正式请求,这个方法参数就是我们设置的post了
                response.setStatus(HttpStatus.SC_NO_CONTENT); //HttpStatus.SC_NO_CONTENT = 204
                response.setHeader("Access-Control-Allow-Methods", "POST, GET, DELETE, OPTIONS, DELETE");//当判定为预检请求后,设定允许请求的方法
                response.setHeader("Access-Control-Allow-Headers", "Content-Type,Authorization"); //当判定为预检请求后,设定允许请求的头部类型
                response.addHeader("Access-Control-Max-Age", "1");
                chain.doFilter(request, response);
                return;
            }

    后台过滤器设置

    此外控制层加入

    @CrossOrigin注解
     
  • 相关阅读:
    Async和Await的用法
    Idea有关收藏的博客
    记录看到的写的好的、实用的JavaScript博客
    Linux实用指令一
    flex布局
    移动端开发常用的vue组件
    npm --save 的含义
    切换npm源为淘宝镜像
    java String Map List 转换
    mysql查看被锁住的表
  • 原文地址:https://www.cnblogs.com/TheGreatDead/p/10737396.html
Copyright © 2011-2022 走看看