无法使用Spring Security弹出用户凭据请求？

Question

我正在将Spring Security集成到我的Spring MVC和Angular App中。

版本：

Spring Security：4.1.5.RELEASE

Spring MVC：4.2.0.RELEASE

Angular：4

集成后，我看到浏览器显示弹出的用户名和密码。即使经过以下更改，我也无法摆脱弹出窗口并继续以角度进行自定义登录表单。

首先，我使用的是http基本身份验证机制。为此创建了以下SecurityConfig.java。 [更新]

@Configuration
@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {

    @Override
    protected void configure(AuthenticationManagerBuilder auth) throws Exception {
        // @formatter:on
        auth.inMemoryAuthentication().withUser("user1").password("user1").roles("USER").and().withUser("user2")
                .password("user2").roles("USER").and().withUser("admin").password("admin").roles("ADMIN");
        // @formatter:off

    }

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        // @formatter:on
        http
                .authorizeRequests().antMatchers("/index.html", "/", "/login", "*.*", "/*.bundle.*", "/*.ico")
                .permitAll().anyRequest().authenticated().and().csrf()
                .csrfTokenRepository(CookieCsrfTokenRepository.withHttpOnlyFalse());
        // @formatter:off
    }

}

对于资源和路径解析，在ServletContextConfiguration.java之后创建。

@Configuration
@EnableWebMvc
public class ServletContextConfiguration extends WebMvcConfigurerAdapter {

    @Override
    public void configureContentNegotiation(ContentNegotiationConfigurer configurer) {
         configurer.favorPathExtension(true).ignoreAcceptHeader(true).useJaf(false)
         .defaultContentType(MediaType.APPLICATION_JSON).mediaType("html",
         MediaType.TEXT_HTML)
         .mediaType("xml", MediaType.APPLICATION_XML).mediaType("json",
         MediaType.APPLICATION_JSON);
    }

    @Override
    public void configureDefaultServletHandling(DefaultServletHandlerConfigurer configurer) {
        configurer.enable();
    }

    @Bean(name = "contentNegotiatingViewResolver")
    public ViewResolver getContentNegotiatingViewResolver(ContentNegotiationManager manager) {
        ContentNegotiatingViewResolver resolver = new ContentNegotiatingViewResolver();
        resolver.setContentNegotiationManager(manager);
        return resolver;
    }

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/**").addResourceLocations("/dist/").resourceChain(true)
                .addResolver(new PathResourceResolver());
    }

}

以下是我的web.xml：

<?xml version="1.0" encoding="ISO-8859-1"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
    version="3.0">
    <display-name>Archetype Created Web Application</display-name>

    <!-- Creates the Spring Container shared by all Servlets and Filters -->
    <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
    </listener>

    <!-- Processes application requests -->
    <servlet>
        <servlet-name>appServlet</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>/WEB-INF/applicationContext.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>appServlet</servlet-name>
        <url-pattern>/</url-pattern>
        <url-pattern>*.html</url-pattern>
        <url-pattern>/index.html</url-pattern>
    </servlet-mapping>

    <welcome-file-list>
        <welcome-file>index.html</welcome-file>
    </welcome-file-list>


    <!-- Spring Security -->
    <filter>
        <filter-name>springSecurityFilterChain</filter-name>
        <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>springSecurityFilterChain</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

</web-app>

我正在使用weblogic服务器来部署war文件。

weblogic.xml

<?xml version="1.0" encoding="UTF-8"?>
<wls:weblogic-web-app
        xmlns:wls="http://xmlns.oracle.com/weblogic/weblogic-web-app"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="http://xmlns.oracle.com/weblogic/weblogic-web-app
        http://xmlns.oracle.com/weblogic/weblogic-web-app/1.4/weblogic-web-app.xsd">
    <wls:context-root>/</wls:context-root>
    <wls:container-descriptor>
        <wls:prefer-application-packages>
            <wls:package-name>org.slf4j.*</wls:package-name>
            <wls:package-name>org.springframework.*</wls:package-name>
            <wls:package-name>org.springframework.web.servlet.view.*</wls:package-name>
            <wls:package-name>oracle.core.*</wls:package-name>
            <wls:package-name>oracle.jdbc.*</wls:package-name>
            <wls:package-name>oracle.net.*</wls:package-name>
            <wls:package-name>oracle.sql.*</wls:package-name>
            <wls:package-name>oracle.security.*</wls:package-name>
            <wls:package-name>org.hibernate.*</wls:package-name>
            <wls:package-name>com.fasterxml.*</wls:package-name>
        </wls:prefer-application-packages>
    </wls:container-descriptor>
</wls:weblogic-web-app>

角度变化：

在app.module.ts介绍http拦截器注入http标头X-Requested-With建议here。

import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule, Routes } from '@angular/router';
import { NgModule } from '@angular/core';
import { Injectable } from '@angular/core';
import {
  HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HTTP_INTERCEPTORS
} from '@angular/common/http';
import { Observable } from 'rxjs/Observable';

import { AppComponent } from './app.component';
import { StoreComponent } from './components/store/store.component';
import { StoreService } from './services/store.service';
import { LoginComponent } from './components/login/login.component';
import { LogoutComponent } from './components/logout/logout.component';

@Injectable()
export class XhrInterceptor implements HttpInterceptor {

  intercept(req: HttpRequest<any>, next: HttpHandler) {
    const xhr = req.clone({
      headers: req.headers.set('X-Requested-With', 'XMLHttpRequest')
    });
    console.log(">>>>>>>>>>HttpRequest intercepted...");
    return next.handle(xhr);
  }
}

const appRoutes: Routes = [
  { path:'', pathMatch: 'full', redirectTo: 'login' },
  { path: 'login', component: LoginComponent},
  { path: 'logout', component: LogoutComponent },
  { path: 'store', component: StoreComponent }
]

@NgModule({
  declarations: [
    AppComponent,
    StoreComponent,
    LoginComponent,
    LogoutComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule.forRoot(appRoutes)
  ],
  providers: [ StoreService, { provide: HTTP_INTERCEPTORS, useClass: XhrInterceptor, multi: true } ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

出于某种原因，我仍然能够看到从浏览器弹出的默认用户名和密码。在Web控制台中，我没有看到X-Requested-With标头。此外，我没有看到我的控制台日志应该在截取http请求时打印。