Angular 如何为前端本地的后端服务器提供服务？_Angular

Angular 如何为前端本地的后端服务器提供服务？

angular

Angular 如何为前端本地的后端服务器提供服务？,angular,Angular,我有一个angular应用程序在apache服务器上运行，位于http://localhost 我有一个后端flask服务器在端口5200的同一台机器上运行（http://localhost:5200）我可以从服务器通过前端访问后端，但是当我从另一台机器尝试时，前端显然会将客户机指向他自己的机器，而这台机器没有运行后端 import { Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/

我有一个angular应用程序在apache服务器上运行，位于

http://localhost

我有一个后端flask服务器在端口5200的同一台机器上运行（

http://localhost:5200

）

我可以从服务器通过前端访问后端，但是当我从另一台机器尝试时，前端显然会将客户机指向他自己的机器，而这台机器没有运行后端

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { BehaviorSubject, Observable, of } from 'rxjs';

@Injectable()
export class DataService {    

  dataUrl = 'http://localhost:5002/api'

  constructor(private http: HttpClient) { }

  getData(): Observable<DataItem> {    
    return this.http.get<DataItem>(this.dataUrl)
  }
}

这可能会有帮助

尝试使用以下命令在第一台计算机上托管站点：

ng-serve主机192.168.1.xx端口80

然后在浏览器中输入来自同一网络上另一台机器的IP和端口：

192.168.1.xx:80

这可能会有所帮助

尝试使用以下命令在第一台计算机上托管站点：

ng-serve主机192.168.1.xx端口80

然后在浏览器中输入来自同一网络上另一台机器的IP和端口：

192.168.1.xx:80

出于这些目的，有环境文件。您可以使用它们来引用不同的后端服务器，在您的例子中是

localhost

和´

。您可以使用标准开发和产品环境文件，也可以创建自己的文件。
如果使用

ng serve`它将自动在开发模式下运行，这将提供开发环境文件。但您也可以提供任意文件（例如）：

环境文件位于目录

environments

中。假设文件如下所示：

export const environment = {
    production: false,
    server: "localhost"
};

例如，您可以使用REST服务中的

environment.server

访问基本URL。在标准角度项目中，将有

environment.prod.ts

和

environment.ts

ng发球

无

-e

将采用

环境。ts

。如果您使用

-e prod

，它将使用另一个。当然，您也可以这样定义环境文件：

environment.stub.ts

（

ng service-e stub

）

在您的示例中，您可以使用：

dataUrl = 'http://' + environment.server + ':5002/api'

要使用特定环境文件构建应用程序，请使用：

ng build --prod --env=prod

出于这些目的，存在环境文件。您可以使用它们来引用不同的后端服务器，在您的例子中是

localhost

和´

。您可以使用标准开发和产品环境文件，也可以创建自己的文件。
如果使用