title: Cors policy error when use Angular 7 post on ionic 4
body: <p>I'm upset to post similar problem but spend more than 3 days and couldn't solve the problem.</p>
  
  <p>Platform: Ionic 4 Angular 7</p>
  
  <p>When I try to Post I have cors policy Error.</p>
  
  <p>Access to XMLHttpRequest at '<a href="https://mersinders.com/api/service.php?run=giris" rel="nofollow noreferrer">https://mersinders.com/api/service.php?run=giris</a>' from origin '<a href="http://localhost:8100" rel="nofollow noreferrer">http://localhost:8100</a>' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.</p>
  
  <p>When I disable chrome security everything works fine. </p>
  
  <blockquote>
    <p>"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe"
    --disable-web-security --disable-gpu --user-data-dir=~/chromeTemp</p>
  </blockquote>
  
  <p>HttpErrorResponse {headers: HttpHeaders, status: 400, statusText: "Bad Request", url: "<a href="https://mersinders.com/api/service.php?run=giris" rel="nofollow noreferrer">https://mersinders.com/api/service.php?run=giris</a>", ok: false, …}</p>
  
  <p>The problem start after using below header on Php api side.     </p>
  
  <blockquote>
    <p>header('Status: 400', TRUE, 400); header('Status: 404', TRUE, 404);</p>
  </blockquote>
  
  <p>I have config.ini.php which include db informations and connections, And service.php which switch case  "service.php?run=XXXXX" .</p>
  
  <p>When I set header in service.php</p>
  
  <blockquote>
    <p>header('Access-Control-Allow-Origin: *');<br>
    header("Access-Control-Allow-Credentials: true");<br>
    header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE,
    OPTIONS');   header('Access-Control-Max-Age: 1000');<br>
    header('Access-Control-Allow-Headers: Content-Type, Content-Range,
    Content-Disposition, Content-Description');</p>
    
    <p>include('config.ini.php');</p>
  </blockquote>
  
  <p>I get below error. </p>
  
  <blockquote>
    <p>Access to XMLHttpRequest at
    '<a href="https://mersinders.com/api/service.php?run=giris" rel="nofollow noreferrer">https://mersinders.com/api/service.php?run=giris</a>' from origin
    '<a href="http://localhost:8100" rel="nofollow noreferrer">http://localhost:8100</a>' has been blocked by CORS policy: Response to
    preflight request doesn't pass access control check: No
    'Access-Control-Allow-Origin' header is present on the requested
    resource.</p>
  </blockquote>
  
  <p>When I set header in .htaccess</p>
  
  <blockquote>
    <p>Header always set Access-Control-Allow-Origin "*"  Header always set
    Access-Control-Allow-Methods "POST, GET,HEAD"  Header always set
    Access-Control-Max-Age "1000"</p>
  </blockquote>
  
  <p>I get below error.</p>
  
  <blockquote>
    <p>Access to XMLHttpRequest at
    '<a href="https://mersinders.com/api/service.php?run=giris" rel="nofollow noreferrer">https://mersinders.com/api/service.php?run=giris</a>' from origin
    '<a href="http://localhost:8100" rel="nofollow noreferrer">http://localhost:8100</a>' has been blocked by CORS policy: Response to
    preflight request doesn't pass access control check: It does not have
    HTTP ok status.</p>
  </blockquote>
  
  <p>But Everything works fine on security disabled chrome and postman.
  Also I tried</p>
  
  <p>proxy.config.json</p>
  
  <pre><code>{
      "/api/*": {
          "target": "https://mersinders.com",
          "secure": false,
          "logLevel": "debug"
  
      }
  }
  </code></pre>
  
  <p>and  ionic.config.json</p>
  
  <pre><code>{
      "name": "mersinders",
      "integrations": {
          "cordova": {}
      },
      "type": "angular",
      "proxies": [{
          "path": "/api/*",
          "proxyUrl": "https://mersinders.com"
      }]
  }
  </code></pre>
  
  <p>and tsconfig.app.json</p>
  
  <pre><code>{
    "extends": "../tsconfig.json",
    "compilerOptions": {
      "outDir": "../out-tsc/app",
      "types": []
    },
    "exclude": [
      "test.ts",
      "**/*.spec.ts"
    ],
    "proxies": [
      {
        "path": "/api/*",
        "proxyUrl": "https://mersinders.com"
      }
    ]
  }
  </code></pre>
  
  <p>My post function</p>
  
  <pre><code> var headers = new HttpHeaders();
      headers.append("Accept", 'application/json');
      headers.append('Content-Type', 'application/json');
      headers.append('Access-Control-Allow-Origin', '*');
  
      let postData = {
        "username": this.userData.username,
        "password": this.userData.password,
        "clientIp": this.cekIp(),
  
      }
      console.log(postData);
      this.http.post(environment.SERVER_URL + "service.php?run=giris", postData,{ headers:headers, observe: 'response' })
        .subscribe(response =&gt; {
          if (response.status == 200 &amp;&amp; response.body[0].ogretmen_token != "") {
            this.isUser.token = response.body[0].ogretmen_token;
            en_isUser.Loggedin = true;
            en_isUser.token = this.isUser.token;
            en_isUser.guid = this.isUser.guid;
            this.status.girisCode = response.status;
            //   this.storage.set('token',this.isUser.token);
            window.localStorage.setItem('token', this.isUser.token);
            this.router.navigate(['/tabs/anasayfa']);
          }
          console.log(this.isUser.token);
        }, error =&gt; {
          this.status.girisCode = error.status;
          this.isUpdated = error.error;
          console.log(error);
        });
  </code></pre>
  
  <p>Question 1) How can We solve cors policy error. And why my headers works only in .htaccess .</p>
  
  <p>Post work with ionic 4 native http but I want to use Angular 7 Http. Thanks for advices.</p>
  
  <p>Edit: When I check logs in server I saw;
  AH01623: client method denied by server configuration: 'OPTIONS' ,</p>
  
  <p>And I used Postman to check if any problem. I saw that When I post data from chrome it seems "POST" in postman but at server it is OPTIONS and blocked. </p>
  
  <p>Edit1: After more try I saw that <a href="https://cors-anywhere.herokuapp.com/" rel="nofollow noreferrer">https://cors-anywhere.herokuapp.com/</a> convert OPTIONS request to POST request that is why it work on chrome. </p>
  
  <p>And I tried to make OPTIONS request via postman and it is failed(405 Not Allowed). but POST request from Postman success. It seems backend problem .  Could someone help why headers works in htaccess but not work in service.php file(Possible?: option method can reach .htaccess and after that server drop that request  ? ). </p>