angular - 如何以角度请求多个 baseurl？

Question

问题描述

I want request 2 url  like this :
1. http://192.168.1.140:10086
2. http://192.168.1.112:7777

所以我使用角度拦截器设置一个baseurl这里是代码

import {Injectable} from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpResponse, HttpErrorResponse, } from '@angular/common/http';
import {Observable, throwError} from 'rxjs';
import {catchError, finalize, map, tap} from 'rxjs/operators';
import {MessageService} from '../service/message.service';

@Injectable()
export class HttpInterceptor implements HttpInterceptor {
  private message: MessageService;

  constructor(message: MessageService) {
    this.message = message;
  }
  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const baseUrl = 'http://192.168.1.140:10086/';
    request = request.clone(
      {url: baseUrl + request.url}
    );
    return next.handle(request)
      .pipe(
        map((event: HttpEvent<any>) => {
          if (event instanceof HttpResponse) {
            // console.log('event--->>>', event);
          }
          return event;
        }),
        catchError((error: HttpErrorResponse) => {
          switch (error.status) {
            case 0:
              this.message.createBasicMessage('connect error');
              break;
            case 400:
              this.message.createBasicMessage(error.error);
              break;
          }
          return throwError(error);
        })
      );
  }
}

你可以看到我在拦截器中使用它，所以当我 http.get('api/test') 我将使用http://192.168.1.140:10086/来请求

import {Component, OnInit} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {interval, of} from 'rxjs';
import {map, mergeMap, take} from 'rxjs/operators';
import {StaffList} from '../interface/staffList';

@Component({
  selector: 'app-test',
  template: `
    <p>
      test works!
    </p>
  `,
  styles: []
})
export class TestComponent implements OnInit {
  pageData: StaffList;
  private http: HttpClient;

  constructor(http: HttpClient) {
    this.http = http;
  }
  ngOnInit(): void {
    this.http.get('api/staff')
      .pipe(
        map((x: StaffList) => x)
      )
      .subscribe(x => {
          this.pageData = x;
        }
      );
  }
}

但我只请求 192.168.1.140:10086 如果我想请求http://192.168.1.112:7777 我如何在拦截器中设置另一个 baseurl ？

标签： angulartypescriptinterceptor