ajax請(qǐng)求如何實(shí)現(xiàn)攜帶自定義header參數(shù)

$.ajax({
    type: "post",
    url:"http://127.0.0.1:4564/bsky-app/template/testPost",
    contentType: "application/json;charset=utf-8",
    data :JSON.stringify({"bodyName":"sdfsdf","date":"2017-11-28 07:34:01","price": 10.5,"tbId": 1}),
    dataType: "json",
    beforeSend: function (XMLHttpRequest) {
   XMLHttpRequest.setRequestHeader("token", "eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIxOD.....");
    },
    success: function (data) {
    alert(data);
    },error:function(error){
     console.log(error);
    }
   });

 beforeSend: function (XMLHttpRequest) {
   XMLHttpRequest.setRequestHeader("token", "eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIxOD.....");
  },

/**
 * 
  * @Title: getAjaxCross
  * @Description: TODO(ajax請(qǐng)求，跨域)
  * @param request
  * @param response
 */
 @RequestMapping(value ="/getAjaxCross",method= {RequestMethod.GET})
 public void getAjaxCross(HttpServletRequest request, HttpServletResponse response){
  try {
  response.setCharacterEncoding("UTF-8");
  
  //設(shè)置允許多個(gè)域名允許跨域集合
   String[] allowDomains = {"http://czt.casicloud.com", "http://czt.ming.com"};
   Set allowOrigins = new HashSet(Arrays.asList(allowDomains));
   String origin = request.getHeader("Origin");
   if(allowOrigins.contains(origin)){
    //設(shè)置允許跨域的配置:Access-Control-Allow-Origin： 響應(yīng)頭指定了該響應(yīng)的資源是否被允許與給定的origin共享
   response.setHeader("Access-Control-Allow-Origin", origin);
   }

  //數(shù)據(jù)
  Map<String, Object> resultMap = new HashMap<String, Object>();
  resultMap.put("message", "ajax請(qǐng)求，跨域成功");
  String result = JsonUtils.objectToJson(resultMap);
  
 response.getWriter().write(result);
 } catch (Exception e) {
 e.printStackTrace();
 }
 }

//4.ajax跨域
   function getCookieAjaxCross() {
    $.ajax({
     type:"get", 
     url:"http://czt.ming.com/xxx/xxx/xxx/getAjaxCross",
     async:true,
     data:{},
     dataType: 'json',
     success: function(data) {
      console.log(data);
     }
    });
   }
   getCookieAjaxCross();

/**
 * 
  * @Title: getCookieAjax
  * @Description: TODO(ajax請(qǐng)求，跨域傳遞cookie)
  * @param request
  * @param response
 */
 @RequestMapping(value ="/getCookieAjax",method= {RequestMethod.GET})
 public void getCookieAjax(HttpServletRequest request, HttpServletResponse response){
  try {
  response.setCharacterEncoding("UTF-8");
  
  response.setHeader("Access-Control-Allow-Credentials", "true");
  //設(shè)置允許多個(gè)域名允許跨域集合
   String[] allowDomains = {"http://czt.casicloud.com", "http://czt.ming.com"};
   Set allowOrigins = new HashSet(Arrays.asList(allowDomains));
   String origin = request.getHeader("Origin");
   if(allowOrigins.contains(origin)){
    //設(shè)置允許跨域的配置:Access-Control-Allow-Origin： 響應(yīng)頭指定了該響應(yīng)的資源是否被允許與給定的origin共享
   response.setHeader("Access-Control-Allow-Origin", origin);
   }
   
  //獲取cookie
  Cookie[] cookies = request.getCookies();
  
  //設(shè)置cookie
  Cookie cookie = new Cookie("access_token_ajax", UUID.randomUUID().toString());
  cookie.setPath("/");
  response.addCookie(cookie);
  
  //數(shù)據(jù)
  Map<String, Object> resultMap = new HashMap<String, Object>();
  resultMap.put("cookies", cookies);
  resultMap.put("message", "ajax請(qǐng)求，跨域傳遞cookie成功");
  String result = JsonUtils.objectToJson(resultMap);
  
 response.getWriter().write(result);
 } catch (Exception e) {
 e.printStackTrace();
 }
 }

//4.ajax跨域攜帶cookie和自定義請(qǐng)求頭header
   function getCookieAjaxCross() {
    $.ajax({
     type:"get", 
     url:"http://czt.ming.com/industry/api/publishForeign/getCookieAjax",
     async:true,
     data:{},
     dataType: 'json',
     xhrFields: {
      withCredentials: true // 發(fā)送Ajax時(shí)，Request header中會(huì)帶上 Cookie 信息。
     },
     crossDomain: true, // 發(fā)送Ajax時(shí)，Request header 中會(huì)包含跨域的額外信息，但不會(huì)含cookie（作用不明，不會(huì)影響請(qǐng)求頭的攜帶）
     success: function(data) {
      console.log(data);
     }
    });
   }
   getCookieAjaxCross();

import java.io.IOException;
import java.util.Arrays;
import java.util.HashSet;
import java.util.Set;

import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
 * 
 * @ClassName: CorsFilter
 * @Description: TODO(跨域請(qǐng)求過(guò)濾器)
 * @author clm
 * @date 2019年10月25日
 *
 */
public class CorsFilter implements Filter {
 @Override
 public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain)
 throws IOException, ServletException {
 /*
 * 跨域請(qǐng)求頭服務(wù)端配置：
 * 1.Access-Control-Allow-Origin：設(shè)置允許跨域的配置， 響應(yīng)頭指定了該響應(yīng)的資源是否被允許與給定的origin共享
 * 2.Access-Control-Allow-Credentials：響應(yīng)頭表示是否可以將對(duì)請(qǐng)求的響應(yīng)暴露給頁(yè)面（cookie）。返回true則可以，其他值均不可以。
 * 3.Access-Control-Allow-Headers:用于預(yù)檢請(qǐng)求中，列出了將會(huì)在正式請(qǐng)求的 Access-Control-Request-Headers 字段中出現(xiàn)的首部信息。（自定義請(qǐng)求頭）
 * 4.Access-Control-Allow-Methods：在對(duì) 預(yù)檢請(qǐng)求的應(yīng)答中明確了客戶(hù)端所要訪問(wèn)的資源允許使用的方法或方法列表。
 */
 
 HttpServletRequest httpRequest = (HttpServletRequest) servletRequest;
 HttpServletResponse httpResponse = (HttpServletResponse) servletResponse;
 //設(shè)置允許多個(gè)域名允許跨域集合
  String[] allowDomains = {"http://czt.casicloud.com", "http://czt.ming.com"};
  Set<String> allowOrigins = new HashSet<String>(Arrays.asList(allowDomains));
  String origin = httpRequest.getHeader("Origin");
  if(allowOrigins.contains(origin)){
   //設(shè)置允許跨域的配置:Access-Control-Allow-Origin： 響應(yīng)頭指定了該響應(yīng)的資源是否被允許與給定的origin共享
   httpResponse.setHeader("Access-Control-Allow-Origin", origin);
  }
  httpResponse.setHeader("Access-Control-Allow-Credentials", "true");
 httpResponse.setHeader("Access-Control-Allow-Headers",
 "Origin, X-Requested-With, Content-Type, Accept, access-token");
 httpResponse.setHeader("Access-Control-Allow-Methods", "GET, PUT, DELETE, POST, OPTIONS");
 if (httpRequest.getMethod().equalsIgnoreCase("OPTIONS")) {
 httpResponse.setStatus(202);
 httpResponse.getWriter().close();
 return;
 }
 filterChain.doFilter(servletRequest, servletResponse);
 }

 @Override
 public void destroy() {
 }

 @Override
 public void init(FilterConfig filterConfig) throws ServletException {
 }

}

 <filter>
 <filter-name>CorsFilter</filter-name>
 <filter-class>xxx.xxx.xxx.xx.xxx.CorsFilter</filter-class>
 </filter>
 <filter-mapping>
 <filter-name>CorsFilter</filter-name>
 <url-pattern>/*</url-pattern>
 </filter-mapping>

 /**
  * 
  * @Title: getPersonHeader
  * @Description: TODO(跨域獲取請(qǐng)求頭)
  * @param request
  * @param response
 */
 @RequestMapping(value ="/getPersonHeader",method=RequestMethod.GET)
 public void getPersonHeader(HttpServletRequest request, HttpServletResponse response){
  try {
  response.setCharacterEncoding("UTF-8");

  String personHeader = request.getHeader("Access-Token");
  System.err.println("獲取自定義請(qǐng)求頭（Access-Token）：" + personHeader);
  
  //數(shù)據(jù)
  Map<String, Object> resultMap = new HashMap<String, Object>();
  resultMap.put("message", "跨域獲取請(qǐng)求頭成功");
  resultMap.put("personHeader", personHeader);
  String result = JsonUtils.objectToJson(resultMap);
 response.getWriter().write(result);
 } catch (Exception e) {
 e.printStackTrace();
 }
 }

//同域前端設(shè)置自定義請(qǐng)求頭，后端獲取自定義請(qǐng)求頭
   function getPersonHeader() {
    $.ajax({
     type:"get", 
     url:"/xxx/xxx/xxx/getPersonHeader",
     async:true,
     //ajax配置請(qǐng)求頭方式，第一種
     headers: {
      "Access-Token":"Access-Token123456",//自定義請(qǐng)求頭
      "Content-Type":"application/json;charset=utf8"
     },
    //ajax配置請(qǐng)求頭方式，第二種
    //beforeSend : function(request) {
 　　  // request.setRequestHeader("Access-Token", "Access-Token123456");
    // request.setRequestHeader("Content-Type", "application/json;charset=utf8");
    //}
     data:{},
     success: function(data) {
      console.log(data);
     }
    });
   }
   getPersonHeader();
   
  //跨域前端設(shè)置自定義請(qǐng)求頭，后端獲取自定義請(qǐng)求頭
   function getPersonHeaderCross() {
    $.ajax({
     type:"get", 
     url:"http://czt.ming.com/xxx/xxx/xxx/getPersonHeader",
     async:true,
     headers: {
      "Access-Token":"Access-Token123456",//自定義請(qǐng)求頭
      "Content-Type":"application/json;charset=utf8"
     },
     data:{},
     crossDomain: true, // 發(fā)送Ajax時(shí)，Request header 中會(huì)包含跨域的額外信息，但不會(huì)含cookie（作用不明，不會(huì)影響請(qǐng)求頭的攜帶）
     success: function(data) {
      console.log(data);
     }
    });
   }
   getPersonHeaderCross();

 /**
 * 
  * @Title: setCookie
  * @Description: TODO(jsonp跨域設(shè)置cookie)
  * @param request
  * @param response
 */
 @RequestMapping(value ="/setCookie.jsonp",method=RequestMethod.GET)
 public void setCookie(HttpServletRequest request, HttpServletResponse response){
  try {
  response.setCharacterEncoding("UTF-8");
  
  //設(shè)置cookie
  Cookie cookie = new Cookie("access_token", UUID.randomUUID().toString());
  cookie.setPath("/");
  response.addCookie(cookie);
  
  //數(shù)據(jù)
  Map<String, Object> resultMap = new HashMap<String, Object>();
  resultMap.put("cookie", cookie);
  resultMap.put("message", "跨域設(shè)置cookie成功");
  String result = JsonUtils.objectToJson(resultMap);
  
  //前端傳過(guò)來(lái)的回調(diào)函數(shù)名稱(chēng)
  String callback = request.getParameter("callback");
  //用回調(diào)函數(shù)名稱(chēng)包裹返回?cái)?shù)據(jù)，這樣，返回?cái)?shù)據(jù)就作為回調(diào)函數(shù)的參數(shù)傳回去了
  result = callback + "(" + result + ")";
 response.getWriter().write(result);
 } catch (Exception e) {
 e.printStackTrace();
 }
 }
 
 /**
 * 
  * @Title: getCookie
  * @Description: TODO(jsonp跨域獲取cookie)
  * @param request
  * @param response
 */
 @RequestMapping(value ="/getCookie.jsonp",method=RequestMethod.GET)
 public void getCookie(HttpServletRequest request, HttpServletResponse response){
  try {
  response.setCharacterEncoding("UTF-8");

  //獲取cookie
  Cookie[] cookies = request.getCookies();
  
  //數(shù)據(jù)
  Map<String, Object> resultMap = new HashMap<String, Object>();
  resultMap.put("cookies", cookies);
  resultMap.put("message", "跨域獲取cookie成功");
  String result = JsonUtils.objectToJson(resultMap);
  
  //前端傳過(guò)來(lái)的回調(diào)函數(shù)名稱(chēng)
  String callback = request.getParameter("callback");
  //用回調(diào)函數(shù)名稱(chēng)包裹返回?cái)?shù)據(jù)，這樣，返回?cái)?shù)據(jù)就作為回調(diào)函數(shù)的參數(shù)傳回去了
  result = callback + "(" + result + ")";
 response.getWriter().write(result);
 } catch (Exception e) {
 e.printStackTrace();
 }
 }

 //1.jsonp跨域設(shè)置cookie
   function setCookieCrossJsonp() {
    $.ajax({
     type:"get", 
     url:"http://czt.ming.com/industry/api/publishForeign/setCookie.jsonp",
     async:true,
     data:{},
     dataType: "jsonp", //返回類(lèi)型為jsonp，實(shí)現(xiàn)跨域
     jsonp:"callback", //jsonp和jsonpCallBack相當(dāng)于在url后添加一個(gè)參數(shù)：?callback=back
     jsonpCallback:"back", //設(shè)定回調(diào)函數(shù)的名字，傳到后臺(tái)，進(jìn)行包裝，不設(shè)定自動(dòng)生成
     success: function(data) { //成功執(zhí)行處理，對(duì)應(yīng)后臺(tái)返回的back(data)方法
      console.log(data);
     }
    });
   }
   setCookieCrossJsonp();
   
  //2.jsonp跨域獲取cookie
   function getCookieCrossJsonp() {
    $.ajax({
     type:"get", 
     url:"http://czt.ming.com/industry/api/publishForeign/getCookie.jsonp",
     async:true,
     data:{},
     dataType: "jsonp", //返回類(lèi)型為jsonp，實(shí)現(xiàn)跨域
     jsonp:"callback", //jsonp和jsonpCallBack相當(dāng)于在url后添加一個(gè)參數(shù)：?callback=back
     jsonpCallback:"back1", //設(shè)定回調(diào)函數(shù)的名字，傳到后臺(tái)，進(jìn)行包裝，不設(shè)定自動(dòng)生成
     success: function(data) { //成功執(zhí)行處理，對(duì)應(yīng)后臺(tái)返回的back(data)方法
      console.log(data);
     }
    });
   }
   getCookieCrossJsonp();