3

I am new to Angular and Docker. I am trying to deploy angular 6 app on Nginx in docker container. My angular app will call web-services with Authorization token. It works fine on my development env with --proxy-config but it does not work in docker container. I tried intercepting the HTTP request and update the URL of web service, but it is not send Authorization headers. How should I call web-services with custom headers?

environment.ts

export const environment = {
production: false,
calculateServiceAPIURL: 'http://localhost:8762'
};


import { Injectable } from '@angular/core';
import {
    HttpRequest,
    HttpHandler,
    HttpEvent,
    HttpInterceptor
} from '@angular/common/http';
import { Observable } from 'rxjs';
import { environment } from './../environments/environment';

@Injectable({
    providedIn: 'root'
})

export class TokeninceptorService implements HttpInterceptor {

constructor() { }

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log(req.headers);
    req = req.clone({
        url: environment.calculateServiceAPIURL + req.url,
        setHeaders: {
            'Content-Type': 'application/json',
            Authorization: 'Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJtYWxhdi5wYXJpa2hAeWFob28uY29tIiwidXNlciI6IntcImlkXCI6MSxcImVtYWlsXCI6XCJtYWxhdi5wYXJpa2hAeWFob28uY29tXCIs'
        }
    });
    return next.handle(req);
}

}

Error Message: Access to XMLHttpRequest at 'http://localhost:8762/binaryTree/calculateSum' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

enter image description here

Request and Response headers

enter image description here

Server is not receiving Authorization header due to which it is responding with 401 Unauthorized response status.

Vikas
  • 11,859
  • 7
  • 45
  • 69
iDev
  • 2,163
  • 10
  • 39
  • 64

0 Answers0