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.
Request and Response headers
Server is not receiving Authorization header due to which it is responding with 401 Unauthorized response status.