How can I set the content type header when securing an application with Spring Security 3.2.0 and serving javascript files?

Question

I have some js files that are served through jetty server and spring security (3.2.0) to Chrome.

Since adding spring security the browser is now complaining that the scripts are loaded as text/html instead of application/javascript. How do I configure my WebSecurityConfigurerAdapter to set the mime type properly?

My config looks like this:

@Autowired
public void configureGlobal( AuthenticationManagerBuilder authBuilder ) throws Exception
{
LOGGER.info( "configureGlobal()" );
DaoAuthenticationConfigurer<AuthenticationManagerB uilder, UserDetailsServiceImpl> userServiceConfigurer = authBuilder.userDetailsService(
new UserDetailsServiceImpl() );

// TODO temporary until we get angular to play well with the required csrf token.
HttpSecurity httpSecurity = getHttp();
httpSecurity.csrf().disable();

ExpressionUrlAuthorizationConfigurer<HttpSecurity> .ExpressionInterceptUrlRegistry interceptUrlRegistry = httpSecurity.authorizeRequests();
interceptUrlRegistry.anyRequest().authenticated();

httpSecurity.authorizeRequests().antMatchers( "/unsecure/**" ).permitAll();
httpSecurity.authorizeRequests().antMatchers( HttpMethod.GET, "/lib/**" ).permitAll();

FormLoginConfigurer<HttpSecurity> formLoginConfigurer = httpSecurity.formLogin();
formLoginConfigurer.loginPage( "/unsecure/login.html" ).permitAll();
}

The error in the Chrome console is:

Resource interpreted as Stylesheet but transferred with MIME type text/html:     "http://localhost:8080/maggie/unsecure/login.html". login.html:18
Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8080/maggie/unsecure/login.html". login.html:31
Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8080/maggie/unsecure/login.html". login.html:28
Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8080/maggie/unsecure/login.html". login.html:33
Resource interpreted as Script but transferred with MIME type text/html: "http://localhost:8080/maggie/unsecure/login.html". login.html:30
Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:8080/maggie/unsecure/login.html". login.html:9
Refused to execute script from 'http://localhost:8080/maggie/lib/boo...otstrap.min.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled. login.html:1
Refused to execute script from 'http://localhost:8080/maggie/lib/angular/angular.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled. login.html:1
Refused to execute script from 'http://localhost:8080/maggie/lib/ang...gular-route.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled. login.html:1
Refused to execute script from 'http://localhost:8080/maggie/unsecure/authenticate.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.

disabling the headers (httpSecurity.headers().disable()) just gave me a different error:

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://localhost:8080/maggie/unsecure/login.html". login.html:18
Uncaught SyntaxError: Unexpected token <

Answer 1

The issue turned out to be ordering of the calls to httpSecurity.

when I put:

httpSecurity.authorizeRequests().anyRequest().authenticated();

last, after permitting access to the login html/js and calls to the form configure the application works.

What isn't clear to me is why using and() and chaining all the calls together works but breaking those some calls out as calls to httpSecurity required different ordering.

A note in the documentation may help others with the same issue.

Answer 2

You can refer this answer.

And, for javascript files, it is better to disable security for them:

  @Override
  public void configure(WebSecurity web) throws Exception {
    web.ignoring().antMatchers("/the_js_path/**");
  }