E2E测试时跨域问题的解决办法

使用谷歌浏览器进行E2E测试时：

• 方法1:

  找到protractor.conf.js配置文件

  配置浏览器属性(禁用谷歌同源策略)：

  capabilities: {
      'browserName': 'chrome',
      'chromeOptions':  {
        'args': ['--disable-web-security','--user-data-dir=C:/Data']
      }
    },
  

  其中--user-data-dir的值可以自定义指定。

  其余配置可参照

  https://blog.51cto.com/7308310/2325925

• 方法2(推荐):

  创建proxy.conf.json配置文件,配置代理

  举例：angular运行在localhost:4200,需要访问地址在localhost:8080的api,api的url为localhost:8080/api/user/,那么配置如下即可(angular代码中的url常量就不需要添加主机地址localhost:8080了,直接使用api/user/即可):

  {
      "/api/*": {  // 要访问的api的url
          "target": "http://localhost:8080", // 要访问的后台服务的主机地址
          "secure": false,
          "loglevel": "debug",
          "changeOrigin": true
     }
  }
  

  找到工程中的angular.json配置文件

  配置跨域策略属性:

  {
      "projects": {
          ...
          ...
          "project-name": {
              "architect": {
                  "build": {
                      "configurations": {
                      "production": { ... },
                       
                      }
                  },
                  "serve": {
                      "builder": ...,
                      "options": {
                              "browserTarget": ...,
                              "proxyConfig": "proxy.conf.json" // 添加
                      }
                  }
              }
          }
      }
  }
  

  配置完成之后，启动e2e测试即可解决跨域问题

使用IE浏览器进行E2E测试时:

• 方法同谷歌配置的方法2,只需要在es5配置中添加"proxyConfig": "proxy.conf.json"即可:

  {
      "projects": {
          ...
          ...
          "project-name": {
              "architect": {
                  "build": {
                      "configurations": {
                      "production": { ... },
                       
                      }
                  },
                  "serve": {
                      "builder": ...,
                      "options": {
                              "browserTarget": ...,
                              "proxyConfig": "proxy.conf.json" 
                      },
                      // 添加
                      "es5": {
                               "browserTarget": "mainpage:build:es5",
                               "proxyConfig": "proxy.conf.json" 
                      }
                  }
              }
          }
      }
  }
  

  配置完成后启动即可。