2016-11-29 63 views
2

我正在尝试开发一个应用程序,用于后端的Spring Boot和用于前端的Angular 2。Angular 2 Spring Boot登录CORS问题

其实我有连接问题,当我从春天访问mvc登录页面。

我得到以下问题:

(控制台)

enter image description here

(角2码) enter image description here

Spring代码enter image description here

enter image description here

我已经为FrontEnd端口设置了全局Cors配置。我的请求返回响应状态200.但我不能访问响应,因为我得到控制台中的错误消息。

Spring dosnt有错误。

回答

6

您需要了解Cors配置的第一件事是添加到后端。您无需将每个来自Angular2应用程序的请求发送给Cors标头。了解到这个问题很容易通过在你的spring安全配置类中添加全局CORS配置来解决。

首先,你需要创建一个过滤器豆:

@Component 
@Order(Ordered.HIGHEST_PRECEDENCE) 
public class MyCorsFilter implements Filter{ 

public MyCorsFilter() { 
    super(); 
} 

@Override 
public final void doFilter(final ServletRequest req, final ServletResponse res, final FilterChain chain) throws IOException, ServletException { 
    final HttpServletResponse response = (HttpServletResponse) res; 
    response.setHeader("Access-Control-Allow-Origin", "http://localhost:3000"); 

    // without this header jquery.ajax calls returns 401 even after successful login and SSESSIONID being succesfully stored. 
    response.setHeader("Access-Control-Allow-Credentials", "true"); 

    response.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE"); 
    response.setHeader("Access-Control-Max-Age", "3600"); 
    response.setHeader("Access-Control-Allow-Headers", "X-Requested-With, Authorization, Origin, Content-Type, Version"); 
    response.setHeader("Access-Control-Expose-Headers", "X-Requested-With, Authorization, Origin, Content-Type"); 

    final HttpServletRequest request = (HttpServletRequest) req; 
    if (!request.getMethod().equals("OPTIONS")) { 
     chain.doFilter(req, res); 
    } else { 
     // do not continue with filter chain for options requests 
    } 
} 

@Override 
public void destroy() { 

} 

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

第2步:在你的春季安全配置类添加:

@Autowired 
private MyCorsFilter myCorsFilter; 


//CORS 
http.addFilterBefore(myCorsFilter, ChannelProcessingFilter.class); 

编辑: 此配置假定你有angular2应用程序在运行本地主机:3000

+0

**感谢**,这是与一个Cors的第一个问题。它为我工作 – mimu1011

+0

很高兴听到:)不客气。 –

1

如果您正在使用Spring 4.2和更多版本,可以使用CORS开箱即用的第一类支持。阅读page

您可以通过在类级别定义以下标注脱身: @CrossOrigin(origins = "http://localhost:3000", maxAge = 3600)