“http://localhost:8100”已被 CORS 策略错误阻止答案

【问题标题】：'http://localhost:8100' has been blocked by CORS policy error“http://localhost:8100”已被 CORS 策略错误阻止
【发布时间】：2019-08-04 23:50:14
【问题描述】：

我在 php 中有 rest api，我试图在 ionic 应用程序中访问，但我遇到了跨策略错误。

这是我正在设置的 php 头文件

  <?php
    header('Access-Control-Allow-Origin: *');
    header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
    header('Access-Control-Allow-Headers: Content-Type,Accept,Authorization');

这是我调用 api 的离子代码

import { HttpClient } from '@angular/common/http'

constructor(public http: HttpClient
  ){}
 login(body){
     return this.http.post(SERVER_URL+LOGIN,body);

  }

这是我得到的错误

Access to XMLHttpRequest at 'http://myIP_ANd_Port/icrm_mobile_mar12/index.php/login_api' from origin 'http://localhost:8100' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

【问题讨论】：

使用 Cors 扩展，例如 this
这是我在移动设备上测试的离子应用
您的 API 中是否允许跨域访问
是的，我在我的 php 课前这样做
查看answer和this

标签： angular ionic4

【解决方案1】：

您需要能够使用 PHP 应用程序中的 OPTIONS 方法响应请求。

您的浏览器或应用正在发送未提供服务的 OPTIONS 请求（预检）。

有关更多信息，您可以查看此答案：CORS with php headers

【讨论】：

【解决方案2】：

覆盖 CORS 策略的一种方法是安装扩展。它将 Allow-Control-Allow-Origin: * 标头添加到所有您的浏览器收到的响应。
您可以做的另一件事是在您的请求中指定您想绕过CORS安全机制。如果你使用，你可以做到通过将 mode 参数设置为 no-cors 来获取 API：Like fetch('http://localhost:8080/posts', { mode: 'no-cors' });

【讨论】：