title: Ionic v4: Using Proxy to resolve CORS fails
body: <p>I know that it is a common problem and has been asked many times. But all methods just didn't work in ionic v4. </p>
  
  <p>I want to get data from this URL: <a href="http://data.szmb.gov.cn/szmbdata/open/openData.do?type=" rel="nofollow noreferrer">http://data.szmb.gov.cn/szmbdata/open/openData.do?type=</a>""&amp;appid=""&amp;appKey="";</p>
  
  <p>Methods tried:</p>
  
  <ol>
  <li>Use the chrome "enable cross-origin resource sharing" plugin. Failed.</li>
  <li>Ionic-native and Cordova plugin. This method returns a <code>Promise</code>, but I want an <code>Observable</code>. </li>
  <li>Editing proxy.conf.json file and add this to angular.js, like this:</li>
  </ol>
  
  <p><code>proxy.conf.json</code>:</p>
  
  <pre><code>{
      "/openData.do?": {
         "target": "http://data.szmb.gov.cn/szmbdata/open",
         "changeOrigin": true,
         "secure": false,
         "logLevel": "debug"
       }
  }
  </code></pre>
  
  <p><code>Angular.json</code>:</p>
  
  <pre><code>"serve": {
            "builder": "@angular-devkit/build-angular:dev-server",
            "options": {
              "browserTarget": "app:build",
              "proxyConfig": "proxy.conf.json"
            },
            "configurations": {
              "production": {
                "browserTarget": "app:build:production"
              },
              "ci": {
                "progress": false
              }
            }
          },
  </code></pre>
  
  <p>which is provided by <a href="https://forum.ionicframework.com/t/proxy-config-not-working-for-v4-beta/139400" rel="nofollow noreferrer">https://forum.ionicframework.com/t/proxy-config-not-working-for-v4-beta/139400</a>. </p>
  
  <ol start="4">
  <li>Add proxies to ionic.config.json - this just doesn't seem to work on ionic v4. </li>
  </ol>
  
  <p>My ionic info:</p>
  
  <pre><code>    Ionic:
  
         ionic (Ionic CLI)             : 4.10.3 (C:\Users\15432\AppData\Roaming\npm\node_modules\ionic)
         Ionic Framework               : @ionic/angular 4.0.1
         @angular-devkit/build-angular : 0.12.4
         @angular-devkit/schematics    : 7.2.4
         @angular/cli                  : 7.2.4
         @ionic/angular-toolkit        : 1.4.0
  
      Cordova:
  
         cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
         Cordova Platforms     : none
         Cordova Plugins       : no whitelisted plugins (1 plugins total)
  
      System:
  
         NodeJS : v10.14.1 (C:\Program Files\nodejs\node.exe)
         npm    : 6.4.1
         OS     : Windows 10
  </code></pre>
  
  <p><strong>Edit</strong>: I tried another method provided by ionic proxy document (<a href="https://ionicframework.com/docs/cli/using-a-proxy" rel="nofollow noreferrer">https://ionicframework.com/docs/cli/using-a-proxy</a>). Still somehow doesn't work. Supposedly, when I already set proxy to like, "<a href="http://data.szmb.gov.cn/szmbdata/open/" rel="nofollow noreferrer">http://data.szmb.gov.cn/szmbdata/open/</a>", I would only need to type <code>http.get(openData.do? + ......)</code> to get to the destination. But instead, <code>ionic serve</code> still returns a "localhost:8100/openData.do?...", as is the case of <em>method 3</em>. </p>