Use angular-cli with multiple path proxy matching

Use the following syntax in your proxy.conf.json:

[  {    "context": ["/api-v1/**", "/api-v2/**"],    "target": "https://other-server.example.com",    "secure": false  }]

Actual syntax that works is as below:

[    {        "context": [            "/api",            "/other-uri"        ],        "target": "http://localhost:8080",        "secure": false    }]

The syntax for multiple entries (using context) is documented here:https://github.com/angular/angular-cli/blob/master/docs/documentation/stories/proxy.md#multiple-entries

const PROXY_CONFIG = [    {        context: [            "/my",            "/many",            "/endpoints",            "/i",            "/need",            "/to",            "/proxy"        ],        target: "http://localhost:3000",        secure: false    }]module.exports = PROXY_CONFIG;

This also requires that you rename your config from .json to .js and point your run command at the new file.

For me the context syntax doesn't quite work (I assume because I want to use wildcards). So I came up with the following solution which allows you to generate a config:

module.exports = [  "/my",  "/many",  "/endpoints",  "/i",  "/need",  "/to",  "/proxy",  "/folder/*"].reduce(function (config, src) {  config[src] = {    "target": "http://localhost:3000",    "secure": false  };  return config;}, {});

This got the job done for me. (note that this still requires that your rename your proxy.conf.json to proxy.conf.js and edit your run command to point at the renamed file)

As of 2021-03, here is the answer:

1. In the CLI configuration file, angular.json, add/modify the proxy file:

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

2. Create a proxy.conf.js such as:

   const PROXY_CONFIG = [    {        context: [            "/my",            "/many",            "/endpoints",            "/i",            "/need",            "/to",            "/proxy"        ],        target: "http://localhost:3000",        secure: false    }]module.exports = PROXY_CONFIG;

Note it is .js, not .json.

Official Details

Update, 2021-07-08 It takes .js or .json. Former one is better as it allows // comment.

For SSL:

"target" : "https://localhost:3001",         "changeOrigin": true,       // solves CORS Error in F12        "logLevel": "debug",        //"info": prints out in console        "rejectUnauthorzied": true, // must be false if not specify here        "secure": false,            // PROD must be "true", but DEV false else "UNABLE_TO_VERIFY_LEAF_SIGNATURE"        "strictSSL": true,          // must be false if not specify here        "withCredentials": true     // required for Angular to send in cookie