本地主机api请求的HTTP失败响应：0未知错误-Angular

Question

I'm trying to create a communication to my Java Jetty Backend from my Angular application. When I try to execute my request I receive the following error:

My code on client side: (Angular 7.2.1). I'm also using a HttpInterceptor for authentication that should work. I'm also running the code in development mode with ng serve .

 @Injectable({ providedIn: 'root' }) export class NgHydrantService { constructor(private http: HttpClient) { } public register(entity: IEntityDescription): Observable<StandardResponsePacket> { let packet = new RegisterEntityRequestPacket(entity); return this.http.post(this._apiUrl, packet.toJson()) .pipe( map(value => { console.log('register result:', value); //<-- never executed return <StandardResponsePacket>HydrantPackage.fromJson(value) }) ); } } //The interceptor intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> { // add authorization header with basic auth credentials if available if (this.user != null) { const clonedRequest = request.clone({ headers: request.headers.set('Authorization', `Basic ${this.user.getAuth()}`) .set('Accept','application/json') }); //This debug line works and looks good! console.log('NgHydrantAuthInterceptor#intercept', clonedRequest); return next.handle(clonedRequest); } return next.handle(request); } 

My Code on server side: (Jetty-9.4.14.v20181114) that runs on localhost.

public final class PacketHandler extends AbstractHandler
{
  @Override
  public void handle( String target,
                    Request baseRequest,
                    HttpServletRequest request,
                    HttpServletResponse response ) throws IOException
  {
    try
    {
        // Declare response encoding and types
        response.setContentType( "application/json; charset=utf-8" );
        // Enable CORS
        response.addHeader("Access-Control-Allow-Origin", "*");
        response.addHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE, HEAD");
        response.addHeader("Access-Control-Allow-Headers", "X-PINGOTHER, Origin, X-Requested-With, Content-Type, Accept");
        response.addHeader("Access-Control-Max-Age", "1728000");
        //... more stuff
    }
    finally
    {
        // Inform jetty that this request was handled
        baseRequest.setHandled( true );
    }
  }
}

Things I checked:

• During research some people reference problems with CORS (that's why I added the header entries in the server side code)
• The same request in Postman works without any problems
• There are no logs on the server side

My question is about a possible solution to get responses from my server during development.

Answer 1

您能否按照以下链接https://www.html5rocks.com/zh-CN/tutorials/cors/中的步骤操作，以获取快速解决方案，请在chrome https://chrome.google.com/webstore/detail/allow-中添加以下插件控制允许origi / nlfbmbojpeacfghkpbjhddihlkkiljbi？HL = EN

Answer 2

i was able to solve a likely problem by setting my web server configuration to allow the cors policy. In my case, i use Nginx web server follow the configuration in this link https://enable-cors.org/server_nginx.html