Angular 2 Spring Boot Login CORS Проблемы

Question

Я пытаюсь разработать приложение с Spring Boot для заднего конца и Angular 2 для переднего конца.

На самом деле у меня есть проблемы с подключением, когда я получаю доступ к странице входа в mvc с весны.

я получаю следующие проблемы:

(консоль)

(Угловое 2 Код)

Spring Код

Я установил глобальную конфигурацию Cors для порта FrontEnd. Мой запрос возвращается с статусом ответа 200. Но я не могу получить доступ к ответу, потому что получаю сообщение об ошибке в консоли.

У весны dosnt есть ошибки.

Answer 1

Прежде всего, вам нужно понять, что конфигурация Cors добавлена ​​в бэкэнд. Вам не нужно отправлять заголовок cors с каждым запросом из приложения Angular2. Понимая это, эту проблему легко устранить, добавив глобальную конфигурацию 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); 

EDIT: Эта конфигурация предполагает, что вы angular2 приложение работает на localhost: 3000

Answer 2

В случае, если вы работаете с Spring 4.2 и более поздними версиями, есть первая поддержка для CORS из коробки , Прочтите это page.

Вы могли бы уйти, определив следующую аннотацию на уровне класса: @CrossOrigin(origins = "http://localhost:3000", maxAge = 3600)