Angular2 : X-XSRF-TOKEN is not allowed by Access-Control-Allow-Headers

Question

I am struggling with this issue today as I am implementing a cross-site API call. The worst thing is it works well from my local environment but once on heroku, it fails with th

Answer 1

The reason is that x-xsrf-token keyword is not in response header Access-Control-Allow-Headers.

I solved this problem in java using following solution:

rsp.setHeader("Access-Control-Allow-Methods", "GET,HEAD,POST,OPTIONS,PUT,DELETE,TRACE,CONNECT");
                rsp.setHeader("Access-Control-Allow-Headers", "cache-control,content-type,hash-referer,x-requested-with, x-xsrf-token");
                if ("OPTIONS".equals(req.getMethod())) {
                    rsp.setStatus(HttpServletResponse.SC_OK);
                    return;
                }