启用 Cors 服务的 ionic post in rest 服务错误

Posted 2023-03-03

【中文标题】启用 Cors 服务的 ionic post in rest 服务错误

【英文标题】：ionic post in rest service error with Cors enabled service

【发布时间】：2018-09-02 15:55:57

【问题描述】：

您好，我是 ionic 的新手。我想在 ionic 中调用邮政服务，但我总是收到此错误； ""

无法加载http://mywebservice.com/api：对预检请求的响应未通过访问控制检查：响应中的“Access-Control-Allow-Origin”标头的值不能是通配符“*”，当请求的凭据模式是“包含”。因此，Origin 'http://localhost:8100' 不允许访问。 XMLHttpRequest 发起的请求的凭证模式由 withCredentials 属性控制。

我已经在我的网络服务 (nancyfx) 中启用了 Cors，即使我在高级 Rest Service 上检查了它。

并在 ionic 中调用 post 服务；

     let headers = new HttpHeaders();
      headers = headers
        .set("Accept", "application/json")
        .set("Content-Type", "application/json")     
        const params = new HttpParams();
        const options =  headers, params, withCredentials: true ;
return this.http
  .post(
    "mywebservice.com/api", headers, options
  )do(res => console.log(res)); 
enter code here

如有任何帮助，谢谢！

【问题讨论】：

在高级 REST 客户端上进行测试时，是否包含 cookie 来模拟 withCredentials 设置？

是的，我安装了 chrome.google.com/webstore/detail/arc-cookie-exchange/… 以便与 arc 一起使用

当您在 chrome 中打开网络调试器时，是否看到带有凭据的请求的标头值设置为 *？这可能是 nancyfx 上的某种错误配置

是的，你是对的，我猜它是关于 nancyfx 配置的。我会做一些事情，如果成功我会写在这里

【参考方案1】：

在您的 ionic .config() 中，您需要设置以下行

delete $httpProvider.defaults.headers.common['X-Requested-With'];
$httpProvider.defaults.useXDomain = true;

【讨论】：

我的目录中没有 ionic.config。你的意思是 ionic.config.json 吗？就在 ionic.config.json 文件中 "name": "testmobile2018", "app_id": "", "type": "ionic-angular", "integrations": "cordova":

它的 .config() 应用程序，您可以在其中定义应用程序状态/路由和 ionic 的基本设置。

【参考方案2】：

我终于通过在 web.config 中添加这些来解决我的问题（在我的 web 服务中启用 cors，nancyfx），（注意将您的自定义标头添加到 Access-Control-Allow-Headers）

    <httpProtocol>
        <customHeaders>
 <add name="Access-Control-Allow-Origin" value="http://localhost:8100"/>
 <add name="Access-Control-Allow-Credentials" value="true"/>
 <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Authorization, Content-Disposition, mycustomheaders!" />
 <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS"/>
        </customHeaders>
    </httpProtocol>