ng-build 上的端口和代理配置 [英] Port and Proxy Config on ng-build

问题描述

我有一个在 int.myapp.com 上运行的前端，它的后端在 int.backend.myapp.com 上.我以为我可以像这样使用 proxy.config.json 进行代理:

I have a frontend running for example on int.myapp.com and it's backend on int.backend.myapp.com. I thought I can do the proxing with the proxy.config.json like this:

 "/api": {
    "target": "https://int.backend.myapp.com",
    "secure": true,
    "changeOrigin": true
  }

在我的 package.json 文件中

And in my package.json file

"start": "ng serve --proxy-config proxy.conf.json"

一切都适用于我的开发环境.

Everything works on my dev environment.

但是当我为生产而构建时:

But when I build for production :

ng build --prod

并在 firebase 上部署

and deploy on firebase

firebase deploy

Web 应用程序无法与 API 通信

The web application is not able to communicate with the API

我该怎么做才能修复它?

How can I do to fix it ?

推荐答案

如果其他人遇到这个问题，我找到了一个解决方法，以防您仍然希望本地运行您的产品angular 应用程序， 使用 http-server 应用程序:

In case anybody else run into this problem, I found a workaround in case you still want to run locally your production angular application, use the http-server application:

npm install -g http-server

构建您的生产应用程序:

Build your production application:

ng build --prod

转到您的 dist/[YOUR_APP_NAME_FOLDER] 文件夹:

Go to your dist/[YOUR_APP_NAME_FOLDER] folder:

cd dist/[YOUR_APP_NAME_FOLDER] 

运行 http-server 应用程序并使用您要指向的后端代理传递代理选项(--proxy 或 -P):

Run the http-server application and pass the Proxy option (--proxy or -P) with the backend proxy you would like to point to:

 http-server -c-1 -P http://localhost:3000 .

这篇关于ng-build 上的端口和代理配置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！