Azure active directory integration angular + adal+ spring boot

Question

I'm trying to integrate Azure active directory with an application I have. The application front end is Angular 7 and back end is Spring boot. What I did was creating a web app in Azure portal and in Angular side by using microsoft adal library get the access token then passing that token with every request and authenticate that token in the spring boot backend. What I need to know is the way I'm doing is correct ie, I'm using the same azure app credentials(Client id, Tenant id.....) in Angular and spring boot. Is we need to create different app for fronend and backend. And getting access token from front end is correct or not.

app.module.ts
-----------------



function initializer(adalService: MsAdalAngular6Service) {
      return () => new Promise((resolve, reject) => {
        if (adalService.isAuthenticated) {
          resolve();
        } else {
          adalService.login();
        }
      });
    }

    @NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule,
        HttpClientModule,
        MsAdalAngular6Module.forRoot({
          tenant: 'xxxbef18-40f6-44e6-972c-407462a99xxx',
          clientId: 'xxx4602f-e3c8-4114-ae23-42bf9e57dxxx',
          redirectUri: 'http://localhost:4200',
          navigateToLoginRequestUrl: false,
          cacheLocation: 'localStorage'
      })
      ],
      providers: [ {
        provide: APP_INITIALIZER,
        useFactory: initializer,
        multi: true,
        deps: [MsAdalAngular6Service]
      },
        {
          provide: HTTP_INTERCEPTORS,
          useClass: TokenInterceptorService,
          multi: true
        }],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

Filter class in backend

@EnableWebSecurity
@EnableGlobalMethodSecurity(prePostEnabled = true)
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    @Autowired
    private AADAuthenticationFilter aadAuthFilter;

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        //allow all request access this url
        http.authorizeRequests().antMatchers("/home").permitAll();

        //access to this url requires authentication
        http.authorizeRequests().antMatchers("/api/**").authenticated();

        http.authorizeRequests().anyRequest().permitAll();
         http.addFilterBefore(aadAuthFilter, UsernamePasswordAuthenticationFilter.class);


    }

}

application.properties

# Specifies your Active Directory ID:
azure.activedirectory.tenant-id=92cbef18-40f6-44e6-972c-407462a99xxx

# Specifies your App Registration's Application ID:
spring.security.oauth2.client.registration.azure.client-id=xxx42c78-c557-48ef-8f09-be40c2093xxx
azure.activedirectory.client-id=xxx4602f-e3c8-4114-ae23-42bf9e57dxxx

# Specifies your App Registration's secret key:
spring.security.oauth2.client.registration.azure.client-secret=xxx-~H98Y68m5fFw9_P9sy-c4C4E3lAxxx
azure.activedirectory.client-secret=xxx-~H98Yxxxx5fFw9_P9sy-c4C4E3lAxxx

# Specifies the list of Active Directory groups to use for authorization:
azure.activedirectory.active-directory-groups=users

Any help would be appreciable

Carl Zhao Carl Zhao · Accepted Answer · 2020-06-05T10:24:46

In theory, the access token can be obtained from the front end. From your configuration, the back end is equivalent to a resource, which is not a problem in itself, but it is generally not recommended.

As you can imagine, our general approach is to create different applications for the front end and the back end, using the front end as the web app end and the back end as the web server end, which provides access tokens.

Azure active directory integration angular + adal+ spring boot

Filter class in backend

application.properties

1 Answers