Angular / Spring Boot：Angular Service 向 localhost:4200 而不是 localhost:8080 发出 Http 请求

Question

我有一个 Angular + Spring Boot 项目。 Angular 项目包含向运行在端口 8080 上的 Spring Boot 应用程序发出 Http 请求的服务。 奇怪的是，至少我的一项服务是对 localhost:4200 而不是 localhost:8080 进行 Http 调用，即使我认为我已经设置了正确的配置。

角度服务：

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Housing } from '../_models/housing';
import { Observable, of } from 'rxjs';
import {catchError} from 'rxjs/internal/operators';

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Authorization': 'jwt-token',
    'Access-Control-Allow-Origin': '*'
  })
};
@Injectable({
  providedIn: 'root'
})

export class HousingService {

  housingList: Housing[];

  constructor(private http: HttpClient) {}

  getAll() {
    return this.http.get<Housing[]>('/api/v1/housing/getAllHousing');
  } 
  getHousingById(id) {
    return this.http.get<Housing>('/api/v1/housing/getHouseById/' + id);
  }
  fetchData(id): Promise<Housing>{
    const promise = this.http.get<Housing>('/api/v1/housing/getHouseById/' + id).toPromise();
    return promise
  }
  addHousing(housing: Housing): Observable<Housing>{
    return this.http.put<Housing>('/api/v1/housing/addOrUpdateHouse', housing, httpOptions)
  }
  enableOrDisableHouseById(id: String){
    return this.http.put<Housing>('/api/v1/housing/enableOrDisableHouseById/'+ id, httpOptions)
  }
  deleteHousing(id): Observable<Housing>{
    return this.http.delete<Housing>('/api/v1/housing/deleteHouseById/' + id, httpOptions)
  }
}

项目根目录下的proxy.conf.json文件：

{
    "/api/*": {
       "target": "http://localhost:8080/",
       "secure": false,
       "changeOrigin": true,
       "logLevel": "debug"
    }
 }

我正在使用以下命令启动我的 Angular 服务器： ng serve --proxy-config proxy.conf.json

错误信息：

Answer 1

您可以配置您的 webpack 代理，它将您的请求转发到适当的位置。

  devServer: {
    ...
    proxy: {
       '/api/v1': 'http://localhost:8080',
    } 
  }