ClientAbortException bei der Ausführung von angular 2 post in tomcat

Question

Nach dem Ausführen der Schnellstart von Angular 2 App habe ich versucht, einen Post zu einem Rest Web-Service in einem anderen Server, der Tomcat ist. Ich habe eine OPTIONS-Methode hinzugefügt, um alle Ursprünge zuzulassen. Nach der Rückkehr von der Methode getOptions() wird die Methode getTestResponse aufgerufen und eine ClientAbortException tritt ein .

Beispielcode:

return this._http.post(url, body, options) 
      .map(res => res.json()); 

Web Service-Code:

@OPTIONS 
@Path("samplePath") 
public Response getOptions() { 
return Response.ok() 
.header("Access-Control-Allow-Origin", "*") 
.header("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT") 
.header("Access-Control-Allow-Headers", "X-Requested-With, Content-Type, Origin, Authorization, Accept, Client-Security-Token, Accept-Encoding") 
.build(); 
} 

@POST 
@Consumes({MediaType.APPLICATION_JSON}) 
@Produces({MediaType.APPLICATION_JSON}) 
public TestResponse getTestResponse(TestRequest testRequest) { 

//somehow get response from database 
// 
} 

Haben Sie eine Ahnung, warum diese Ausnahme auftreten könnten?

Answer 1

Dies ist, weil Sie hier Kopfzeilen nur zu Ihrer Option Anfrage hinzufügen.

Aber tatsächlich scheitert POST.

Um das Problem zu beheben, fügen Sie am besten einen CORS-Filter zu Ihrer Anwendung hinzu, der auf alle Anfragen angewendet wird.

CorsFilterApi

import org.jboss.resteasy.plugins.interceptors.CorsFilter; 

@ApplicationPath(RestApplication.ROOT_PATH) 
public class RestApplication extends Application { 

    public static final String ROOT_PATH = "/resources"; 

    private Set<Object> singletons = new HashSet<>(); 


    ... 



    @Override 
    public Set<Object> getSingletons() { 

     CorsFilter corsFilter = new CorsFilter(); 
     corsFilter.getAllowedOrigins().add("*"); 
     corsFilter.setAllowCredentials(true); 
     corsFilter.setAllowedHeaders("origin, content-type, accept, authorization"); 
     corsFilter.setAllowedMethods("GET, POST, DELETE, PUT, OPTIONS, HEAD"); 
     singletons.add(corsFilter); 

     return singletons; 
    } 
} 

EDIT:

Lösung 2 Header nur auf Ihre Post Anfrage anwenden und stellen Sie sicher, dass Ihre @OPTION REQUEST enthält, ist nicht @PATH weil dann ist es nicht gleiche Anfrage in Ihrem Fall:

@OPTIONS 
public Response getOptions() { 
return Response.ok() 
.header("Access-Control-Allow-Origin", "*") 
.header("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT") 
.header("Access-Control-Allow-Headers", "X-Requested-With, Content-Type, Origin, Authorization, Accept, Client-Security-Token, Accept-Encoding") 
.build(); 
} 

@POST 
@Consumes({MediaType.APPLICATION_JSON}) 
@Produces({MediaType.APPLICATION_JSON}) 
public Response getTestResponse(TestRequest testRequest) { 

    return Response.ok() 
     .header("Access-Control-Allow-Origin", "*") 
     .header("Access-Control-Allow-Headers", "origin, content-type, accept, authorization") 
     .header("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT, OPTIONS").build(); 
}