Problem description

The global request is intercepted through the axis of Vue. After adding the identify and token fields to the request header, the back-end zuul gateway is accessed. An error occurs in the browser, resulting in that the background cannot receive the custom header field of HTTP package and cannot authenticate the gateway well
the error is as follows:
access to XMLHttpRequest at‘ http://127.0.0.1:27000/api/v1/index -Infos’ from origin ‘http://’ has been blocked by CORS policy: request header field identification is not allowed by access control allow headers in preflight response.
network and console errors are as follows:

Error analysis

The background is cross-domain. An error occurs when a field is added to the header. In CORS, the options method will be used to initiate a pre-check request (generally, it will be automatically initiated when browsing detects that the request is cross-domain) to detect whether the actual request can be accepted by the server. The access control request method header field in the pre-check request message informs the server of the HTTP method used for the actual request
the access control request headers header field tells the server the custom header field carried by the actual request. The server determines whether to accept the next actual request based on the information obtained from the pre-check request. The access control allow methods header field returned by the server informs the client of all allowed request methods
to sum up, when the browser sends a request header with customization, the browser will first send an options pre-check request to the server to detect whether the server of the request allows customization of cross-domain fields. If yes, continue to execute the request. If not, an error message will be returned to prompt an error.

Solution:

Add the corresponding allow field in the cross domain request header and add your own custom field in the access control allow headers field. The request can be accessed. The interception code in zuul:

@Override
    public Object run() throws ZuulException {
        RequestContext ctx = RequestContext.getCurrentContext();
        HttpServletRequest request = ctx.getRequest();
        HttpServletResponse response = ctx.getResponse();

        response.setHeader("Access-Control-Allow-Origin",request.getHeader("Origin"));
        response.setHeader("Access-Control-Allow-Credentials","true");
        response.setHeader("Access-Control-Allow-Methods","GET, HEAD, POST, PUT, DELETE, OPTIONS, PATCH");
        response.setHeader("Access-Control-Allow-Headers","authorization, content-type,token,identify");
        response.setHeader("Access-Control-Expose-Headers","X-forwared-port, X-forwarded-host");
        response.setHeader("Vary","Origin,Access-Control-Request-Method,Access-Control-Request-Headers");

        if ("OPTIONS".equalsIgnoreCase(request.getMethod())){
            ctx.setSendZuulResponse(false); 
            ctx.setResponseStatusCode(HttpStatus.OK.value());
            ctx.set("isSuccess", true);
            return null;
        }
        ctx.setSendZuulResponse(true); 
        ctx.setResponseStatusCode(HttpStatus.OK.value());
        ctx.set("isSuccess", true);
        return null;
    }