Как решить ошибку 401 с запросом авторизации

Question

Я разрабатываю приложение с Angular 7 и Spring Boot. Моя проблема с запросом авторизации.

Я много искал, и все решения, которые я нашел, такие же, как в моем коде, но проблема в том, что запросы хорошо работают с Postman, а с Angular не работают.

это ошибка

и это мой профиль службы:

getEmployeeById(id: number) {

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Authorization': 'Basic ' + btoa('user:userPass'),
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'GET, POST, PATCH, PUT, DELETE, OPTIONS',
    'Access-Control-Allow-Headers': 'Origin, Content-Type, X-Auth-Token'
  })
};
return this.http.get<UserProfile>( this.baseUrl.oneEmployee.replace(':id', id),
  httpOptions) ;
}

и это конфигурация безопасности при загрузке Spring:

@Override
protected void configure(final AuthenticationManagerBuilder auth) throws Exception {
    auth.inMemoryAuthentication()
            .withUser("admin").password(encoder().encode("adminPass")).roles("ADMIN")
            .and()
            .withUser("user").password(encoder().encode("userPass")).roles("USER");
}

@Bean
public PasswordEncoder encoder() {
    return new BCryptPasswordEncoder();
}


@Override
protected void configure(HttpSecurity http) throws Exception {
    /*http
            .csrf().disable()
            .authorizeRequests().anyRequest().authenticated()
            .and()
            .httpBasic();*/

    //http.addFilterBefore(new CorsFilter(), ChannelProcessingFilter.class);
    http.authorizeRequests().antMatchers("/").permitAll()
            .anyRequest().fullyAuthenticated().and().httpBasic().and().csrf().disable();
}

Answer 1

Вы используете два разных сервера на двух разных портах, поэтому выдается эта ошибка. Вы можете исправить это, добавив @CrossOrigin на свой контроллер покоя или создав такой перехватчик:

public class CrossOriginInterceptor extends HandlerInterceptorAdapter {

    public static final String REQUEST_ORIGIN_NAME = "Origin";

    public static final String CREDENTIALS_NAME = "Access-Control-Allow-Credentials";
    public static final String ORIGIN_NAME = "Access-Control-Allow-Origin";
    public static final String METHODS_NAME = "Access-Control-Allow-Methods";
    public static final String HEADERS_NAME = "Access-Control-Allow-Headers";
    public static final String MAX_AGE_NAME = "Access-Control-Max-Age";

    private List<String> origins=null;

    @Value("${origin.address}") private String origin;
    @Value("${origin.controlEnabled}") private boolean controlEnabled;

    @PostConstruct
    public void method() {
        List<String> stringList = new ArrayList<String>();
        stringList.add(origin);
        this.origins = stringList;
    }

    @Override 
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {

        if(!controlEnabled){ return super.preHandle(request, response, handler);}

        response.setHeader(CREDENTIALS_NAME, "true");
        response.setHeader(METHODS_NAME, "GET, OPTIONS, POST, PUT, DELETE, PATCH");
        response.setHeader(HEADERS_NAME, "Origin, X-Requested-With, Content-Type, Accept");
        response.setHeader(MAX_AGE_NAME, "3600");

        String reqOrigin = request.getHeader(REQUEST_ORIGIN_NAME);
        if (StringUtils.isEmpty(reqOrigin) || origins.contains(reqOrigin)) {
            response.setHeader(ORIGIN_NAME, reqOrigin);
            return true; // Proceed
        } else {
            response.setHeader(ORIGIN_NAME, origins.iterator().next());
            return false; 
        }
    }
}

и добавление этих строк в конфигурацию Spring:

<mvc:interceptors>
<bean id="crossOriginInterceptor"
    class="com.systemevolution.controller.CrossOriginInterceptor" /></mvc:interceptors>