如何使用 Angular 6 拦截器更改 HTTP 请求 URL答案

【问题标题】：how to change HTTP Request URL using angular 6 interceptor如何使用 Angular 6 拦截器更改 HTTP 请求 URL
【发布时间】：2020-05-18 04:25:50
【问题描述】：

我正在开发一个角度应用程序并使用 HTTP 模块的 get / post 方法从后端 API 端点获取数据。最近我检查了一个 Angular 应用程序，它们在其中隐藏 API 真实端点并替换为其他端点。

例如

真实端点：-'http://192.168.1.192:8080/restaurant/getUserData/'

替换端点：-'http://192.168.1.192:8080/restaurant/getServerData'

我还可以在“开发者工具”的“网络”选项卡中看到被替换的端点。

我知道这可以通过使用拦截器概念来实现。但我从未使用过 HTTP 拦截器。如果有人知道如何达到同样的效果，请提出建议。

【问题讨论】：

请参考angular.io/guide/http#http-interceptors
http 拦截器一般不用于此目的。
我建议你看看代理angular.io/guide/build#proxying-to-a-backend-server

标签： javascript ajax angular angular-httpclient angular-http-interceptors

【解决方案1】：

@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);
}

【讨论】：

【解决方案2】：

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

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

【讨论】：