Angular2 Ng2文件上传CORS问题

Question

我是尝试< code>angular2的新手。我已经安装了angular2文件上传。我在这里复制了教程中的所有代码

我完全复制开发人员在那里写的内容。但是我遇到这样的问题：

XMLHttpRequest无法加载http://localhost:8080/citizen/upload。对预检请求的响应未通过访问控制检查:响应中“Access-Control-Allow-Credentials”标头的值为“”，当请求的凭据模式为“include”时，该值必须为“true”。因此，不允许访问源“http://localhost:4200”。XMLHttpRequest发起的请求的凭据模式由withCredentials属性控制。

我的< code>SpringBoot中有这样的< code>CORS过滤器

@Component
public class SimpleCorsFilter implements Filter {
     @Override
     public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Origin", "http://localhost:4200");
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Authorization, Content-Type, Accept, enctype");
        chain.doFilter(req, res);
    }

在我添加那个angular2文件上传代码之前仍然可以。如何解决？

Answer 1

当发生跨源请求时，它首先发送一个 HTTP 选项来检查服务器是否允许跨源请求。如果您使用的是 Spring 安全性，请检查您是否允许 HTTP 选项在没有验证的情况下运行。如果在那里，请添加这样的过滤器

 protected void doFilterInternal(HttpServletRequest httpServletRequest, HttpServletResponse httpServletResponse, FilterChain filterChain) throws ServletException, IOException {
    httpServletResponse.addHeader("Access-Control-Allow-Origin", "http://localhost:4200");
    httpServletResponse.setHeader("Access-Control-Allow-Credentials", "true");
    httpServletResponse.addHeader("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT");
    httpServletResponse.addHeader("Access-Control-Allow-Headers", "X-Requested-With, Content-Type, X-Codingpedia, Authorization");
    httpServletResponse.addHeader("access-control-expose-headers", "Authorization");

    if (!"OPTIONS".equals(httpServletRequest.getMethod())) {
        filterChain.doFilter(httpServletRequest, httpServletResponse);
    }
}