具有env变量的Angular CLI代理

Question

我需要为后端服务器创建一个代理才能与其通信。我已经成功设置了此设置，但是现在有2个地方需要在更改环境时更改变量。

我的版本：

• 角度CLI 7.0.6
• 角度的 7.1.0

注意：我有代理工作（请参阅Angular文档以获取设置），我只想改进设置。

---

Proxy.conf.js

这是我当前的（并且正在工作！）config.js

const PROXY_CONFIG = {
  "/api/*": {
    "target": "https://url.to.somewhere/",
    "logLevel": "debug",
    "changeOrigin": true
  }
};

module.exports = PROXY_CONFIG;

我希望将此文件与Angular environment.ts文件结合在一起。

---

我想要的是

我想使用environment.ts文件中的变量来配置代理，因此我只需要维护我的environment.ts而不是两个文件（也可以是proxy.conf.js）。

与此类似：

import {env} from 'environments/environment';

const root = env.BASE_SUFFIX + '/*'; // BASE_SUFFIX = '/api'

function getConfig() {
  const PROXY_CONFIG = {};
  PROXY_CONFIG[root] = {
    target: env.API_URL, // API_URL = https://url.to.somewhere/
    logLevel: "debug",
    changeOrigin: true,
  };

  return PROXY_CONFIG;
}

module.exports = getConfig();

我目前遇到的问题是environment.ts是一个Typescript文件，无法正确包含在javascript中，因为import {foo} from 'bar'我的environment.ts文件中有一些文件。

const env = require(environments/environment.ts).env由于导入了ES6，因此无法正常工作。

---

关于如何执行此操作的任何建议，或者是否可行，我应该只使用2个单独的文件吗？

Answer 1

我就是这样用的 你可以试试这个

// 创建 proxy.conf.json

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

// 在 package.json 文件“scripts”下找到“start”

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

// 接口调用

this.http.post('/api/api_name/')