I am working on a angular app & fetching data from back end API endpoint with the get / post method of HTTP module. Recently I have checked a angular app where they are hiding API real endpoint & replacing with some other end point.

for e.g

Real Endpoint:- 'http://192.168.1.192:8080/restaurant/getUserData/'

Replaced Endpoint:- 'http://192.168.1.192:8080/restaurant/getServerData'

also I can see the replaced endpoint in the 'network' tab of 'Developer Tool'.

I know that this can be achieved by using interceptors concept. but I never worked with HTTP interceptor. if any one know how to achieve the same please suggest.

I am working on a angular app & fetching data from back end API endpoint with the get / post method of HTTP module. Recently I have checked a angular app where they are hiding API real endpoint & replacing with some other end point.

for e.g

Real Endpoint:- 'http://192.168.1.192:8080/restaurant/getUserData/'

Replaced Endpoint:- 'http://192.168.1.192:8080/restaurant/getServerData'

also I can see the replaced endpoint in the 'network' tab of 'Developer Tool'.

I know that this can be achieved by using interceptors concept. but I never worked with HTTP interceptor. if any one know how to achieve the same please suggest.

• javascript
• ajax
• angular
• angular-httpclient
• angular-http-interceptors

• Please refer to angular.io/guide/http#http-interceptors – uajov6 Commented Dec 18, 2019 at 10:42
• http interceptors are not used for this purpose generally. – Mridul Commented Dec 18, 2019 at 10:45
• I would suggest you look at proxy angular.io/guide/build#proxying-to-a-backend-server – Bojan Kogoj Commented Dec 18, 2019 at 10:49

2 Answers 2

@Injectable()
export class Interceptor implements HttpInterceptor {
 constructor() { }
 const redirectRequest = request.clone({ url: 'http://192.168.1.192:8080/restaurant/getServerData', method: "get" });
      return next.handle(redirectRequest);
}

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

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const dupReq = req.clone({ url: 'mynewurl.' });
    return next.handle(dupReq);
  }
}