CORS в angular с использованием tomcat

У меня есть собственный проект angular 5, у меня есть компонент перехватчика HTTP для добавления аутентификации в заголовок для всех запросов, а также у меня есть служба для вызова API пользовательского сервера. когда я использую HTTP, моя служба отдыха работает нормально (конечно, я добавил фильтр cors в web.xml моего tomcats), но мой компонент HTTP-перехватчика не улавливает его, но когда я использую httpClient, он бросает компонент HTTP-перехватчика, но ответ сервера «В запрошенном ресурсе отсутствует заголовок« Access-Control-Allow-Origin »». не могли бы вы мне помочь?

    import { Injectable } from '@angular/core';
import { environment } from '../../../environments/environment';

import { Http, Headers, Response, RequestOptions, RequestMethod } from 
'@angular/http';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
import { HttpClient, HttpHeaders } from '@angular/common/http';

const API_URL = environment.apiUrl;

@Injectable()
export class RestService {

constructor(private http: HttpClient) { }

private handleError (error: Response | any) {
console.error('ApiService::handleError', error);
return Observable.throw(error);
}


public getAll(input: any, url: string): Observable<any> {

return this.http
  //.get('http://httpbin.org/headers')
  .post(API_URL + url, input)
  .map(response => {
    const returnedData = response;
    return returnedData;
  })
  .catch(this.handleError);
}

}

import { Injectable, Injector } from '@angular/core';
import { HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpHeaders } 
from '@angular/common/http';
import { Observable } from 'rxjs/Rx';
import 'rxjs/add/observable/throw';
import 'rxjs/add/operator/catch';


@Injectable()
export class HttpinterceptorComponent implements HttpInterceptor {
constructor() { }

intercept(req: HttpRequest<any>, next: HttpHandler): 
Observable<HttpEvent<any>> {

console.log('intercepted request ... ');

const headers = new HttpHeaders({
  'sessionId': 'token 123',
  'Content-Type': 'application/json'
});


// Clone the request to add the new header.
const authReq = req.clone({headers});

console.log('Sending request with new header now ...');

// send the newly created request
return next.handle(authReq)
.catch((error, caught) => {
  // intercept the respons error and displace it to the console
  console.log('Error Occurred');
  console.log(error);
  // return the error to the method that called it
  return Observable.throw(error);
}) as any;
}
}

angular cors tomcat angular5
person Reza    schedule 27.01.2018    source источник
comment
У вас проблема с сервером. Он не устанавливает заголовок Access-Control-Allow-Origin для ответов, как следует.   -  person JB Nizet    schedule 27.01.2018

Ответы (2)


arrow_upward
0
arrow_downward

В вашем фильтре tomcat вам нужно добавить следующее и распространить изменения конфигурации.

<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>
person Mike Tung    schedule 27.01.2018
comment
спасибо за ваш ответ, как я уже сказал, я добавляю это в свой web.xml моего tomcat, и когда я использую HTTP для отправки запроса, мой сервер принимает мой запрос, но когда я использую httpClient, мой сервер отвечает No 'Access-Control-Allow- Заголовок происхождения - person Reza; 29.01.2018
comment
Это включено? Ваш сервлет не может его использовать - person Mike Tung; 29.01.2018
comment
извините, я не могу понять смысл вашего вопроса. Он включен?, но я помещаю этот фильтр в файл web.xml, и сервер принимает мой запрос localhost, но когда я меняю модуль HTTP на модуль httpClient с '@angular/common/ http', я получаю ошибку CORS - person Reza; 29.01.2018

arrow_upward
0
arrow_downward

после нескольких недель, наконец, найдено решение, если вы используете Spring MVC в своем бэкэнде, вы можете включить фильтр CORS, расширив WebMvcConfigurerAdapter без какой-либо настройки сервера

@Configuration
@EnableWebMvc
public class WebConfig extends WebMvcConfigurerAdapter {

   @Override
   public void addCorsMappings(CorsRegistry registry) {
       registry.addMapping("/**");
   }
}

а также поместите CorsOrigin на свой контроллер или ваш конкретный метод

@CrossOrigin(origins = "http://localhost:4200", maxAge = 3600)

Поддержка CORS в Spring Framework

Включение запросов между источниками для веб-службы RESTful

person Reza    schedule 19.02.2018