如何在 Protractor 中配置后端 URL（前端项目）答案

【问题标题】：How to configure backend URL in Protractor (frontend project)如何在 Protractor 中配置后端 URL（前端项目）
【发布时间】：2020-06-02 23:31:30
【问题描述】：

我有两个独立的项目。一个前端（Angular V6）和另一个后端（Springboot v2）。

我正在尝试使用 Protractor 实现 e2e 测试，但是我无法在前端项目中正确配置后端 URL。

我的量角器.conf.js：

const { SpecReporter } = require('jasmine-spec-reporter');

exports.config = {
  allScriptsTimeout: 11000,
  specs: [
    './src/**/*.e2e-spec.ts'
  ],
  capabilities: {
    'browserName': 'chrome'
  },
  directConnect: true,
  baseUrl: 'http://localhost:4200/',
  framework: 'jasmine',
  jasmineNodeOpts: {
    showColors: true,
    defaultTimeoutInterval: 900000000,
    print: function() {}
  },
  onPrepare() {
    require('ts-node').register({
      project: require('path').join(__dirname, './tsconfig.e2e.json')
    });
    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
  }
};

后端项目在这个地址运行：http://localhost:8080/

前端项目在这个地址运行：http://localhost:4200/

在打开测试页面时，前端项目尝试访问以下 url 的服务：http://localhost:4200/car/

它应该在这个 URL：http://localhost:8080/car

因此测试中断，因为没有这样的 URL：http://localhost:4200/car。

所以问题是：有什么方法可以在前端项目中配置后端 URL？

【问题讨论】：

标签： angular gulp protractor

【解决方案1】：

是的，您可以设置角度代理以将一些端点转发到您的后端。创建 proxy.conf.js

const PROXY_CONFIG = [
    {
        context: [
            "/car",
            "/anything"
        ],
        target: "http://localhost:8080",
        secure: false
    }
]

module.exports = PROXY_CONFIG;

并将其添加到您的 angular.cli 服务配置中

....
"architect": {
  "serve": {
    "builder": "@angular-devkit/build-angular:dev-server",
    "options": {
      "proxyConfig": "src/proxy.conf.js"
    },

【讨论】：