angular 2 with spring-boot security rest api

Question

I am developing a webapp that has frontend written in Angular2 (typescript) which generate from angular cli and Spring Boot 1.5.2 RELEASE. As I've wanted to work decoupled I have my REST deployed on Tomcat(localhost:8084 with contextpath app-api ) and the frontend on angular cli (localhost:4200).

My problem when I login and then call other api, but result is 401. JSessionId is not keep and send in header of the second request after logining success.

This is my bean config:

<?xml version="1.0" encoding="UTF-8"?>
<beans:beans xmlns="http://www.springframework.org/schema/security"
    xmlns:beans="http://www.springframework.org/schema/beans" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://www.springframework.org/schema/beans
                    http://www.springframework.org/schema/beans/spring-beans.xsd
                    http://www.springframework.org/schema/security
                    http://www.springframework.org/schema/security/spring-security.xsd">
    <global-method-security />

    <beans:bean id="failureHandler" class="my.app.auth.RESTAuthenticationFailureHandler"></beans:bean>
    <beans:bean id="successHandler" class="my.app.auth.RESTAuthenticationSuccessHandler"></beans:bean>
    <beans:bean id="loginUrlAuthenticationEntryPoint" class="my.app.auth.RESTAuthenticationEntryPoint"></beans:bean>

    <beans:bean id="loginPathRequestMatcher" class="org.springframework.security.web.util.matcher.AntPathRequestMatcher">
        <beans:constructor-arg type="java.lang.String" value="/login" />
    </beans:bean> 

    <beans:bean id="customUsernamePasswordAuthenticationFilter"
        class="my.app.auth.AuthenticationFilter">
        <beans:constructor-arg ref="loginPathRequestMatcher"/>
        <beans:constructor-arg ref="environment"/>
        <beans:constructor-arg ref="httpClient"/>

        <beans:property name="authenticationManager" ref="authenticationManager" />
        <beans:property name="sessionAuthenticationStrategy" ref="session-management" />
        <beans:property name="authenticationFailureHandler" ref="failureHandler" />
        <beans:property name="authenticationSuccessHandler" ref="successHandler" />
    </beans:bean>

    <http auto-config="false" use-expressions="true"
        disable-url-rewriting="true" entry-point-ref="loginUrlAuthenticationEntryPoint">
        <csrf disabled="true" />
        <custom-filter position="FORM_LOGIN_FILTER"
            ref="customUsernamePasswordAuthenticationFilter" />
        <custom-filter after="FORM_LOGIN_FILTER" ref="concurrencyFilter" />

        <intercept-url pattern="/login" access="permitAll" />
        <intercept-url pattern="/" access="permitAll" />

        <intercept-url pattern="/api/**" access="hasAnyRole('ROLE_USER')" />

        <logout logout-success-url="/login" />

        <headers>
            <frame-options policy="SAMEORIGIN" />
            <hsts include-subdomains="true" disabled="false" />
            <header name="Access-Control-Allow-Origin" value="*"/>
            <header name="Access-Control-Allow-Methods" value="POST, GET, OPTIONS, DELETE"/>
            <header name="Access-Control-Max-Age" value="3600"/>
            <header name="Access-Control-Allow-Headers" value="x-requested-with, authorization, Content-Type, *"/>
        </headers>

        <session-management
            session-authentication-strategy-ref="session-management" />
    </http>

    <beans:bean id="concurrencyFilter"
        class="my.app.auth.ConcurrentSessionFilter">
        <beans:constructor-arg ref="sessionRegistry" />
        <beans:constructor-arg name="expiredUrl" value="/" />
    </beans:bean>

    <beans:bean id="sessionRegistry" class="my.app.auth.SessionRegistry" />

    <beans:bean id="session-management"
        class="org.springframework.security.web.authentication.session.CompositeSessionAuthenticationStrategy">
        <beans:constructor-arg>
            <beans:list>
                <beans:bean
                    class="org.springframework.security.web.authentication.session.ConcurrentSessionControlAuthenticationStrategy">
                    <beans:constructor-arg ref="sessionRegistry" />
                </beans:bean>
                <beans:bean
                    class="org.springframework.security.web.authentication.session.SessionFixationProtectionStrategy" />
                <beans:bean
                    class="org.springframework.security.web.authentication.session.RegisterSessionAuthenticationStrategy">
                    <beans:constructor-arg ref="sessionRegistry" />
                </beans:bean>
            </beans:list>
        </beans:constructor-arg>
    </beans:bean>

    <authentication-manager alias="authenticationManager">
        <authentication-provider ref="customAuthenticationProvider" />
    </authentication-manager>

    <beans:bean id="customAuthenticationProvider" class="my.app.auth.UserAuthProvider" />

    <beans:bean id="authenticationService" class="my.app.auth.AuthenticationService" />
</beans:beans>

I refer angular2-spring-boot-security topic, but I cannot resolve my problem or maybe i not yet understand this solution.

Have any suggestion for my problem? Or discuss with me? Thanks.

Answer 1

Thank all. I solved my problem by declare exactly Access-Control-Allow-Origin . And use withCredentials in config spring, http in angular 2:

        <header name="Access-Control-Allow-Origin" value="http://localhost:4200"/>
        <header name="withCredentials" value="true"/>
        <header name="Access-Control-Allow-Methods" value="GET, POST, OPTIONS, PUT, PATCH, DELETE"/>
        <header name="Access-Control-Max-Age" value="3600"/>
        <header name="Access-Control-Allow-Headers" value="*"/>
        <header name="Access-Control-Allow-Credentials" value="true"/>

And add http config in constructor of component:

constructor(private http: Http) {
    let _build = (<any>http)._backend._browserXHR.build;
    (<any>http)._backend._browserXHR.build = () => {
      let _xhr = _build();
      _xhr.withCredentials = true;
      return _xhr;
    };
  }

It's work fine with Get method request. But now i have big problem with Post method request. When I add Content-Type into header, request not import JSESSIONID from cookie, but if i don't add Content-Type i will get error code 415 about error Media Type of server.

I tried with Http of angular 2 and XMLHttpRequest . What's wrong here?