未使用Access-Control-Allow-Origin通配符却遭Chrome报错求助

这个报错其实是浏览器的同源策略安全限制导致的，核心原因很明确：当你的请求处于credentials: include模式（也就是请求携带Cookie、HTTP认证信息或者客户端SSL证书时），服务端返回的Access-Control-Allow-Origin响应头不能是通配符*，必须指定具体的请求源（比如你的http://localhost:8080）。

下面给你几个针对性的解决方案，按优先级排序：

1. 调整服务端的CORS配置（最根本的解决办法） #

直接修改目标服务（https://bla.bla）的跨域配置：

• 将Access-Control-Allow-Origin的值设置为请求的具体源：http://localhost:8080（生产环境换成你的正式域名）
• 同时必须添加Access-Control-Allow-Credentials: true响应头，明确允许带凭证的跨域请求

举两个常见服务端的配置例子：

Node.js/Express 示例 #

const cors = require('cors');
app.use(cors({
  origin: 'http://localhost:8080',
  credentials: true
}));

Nginx 配置示例 #

location / {
  add_header Access-Control-Allow-Origin http://localhost:8080;
  add_header Access-Control-Allow-Credentials true;
  # 其他CORS相关头（比如Allow-Methods、Allow-Headers）按需添加
}

2. 检查并调整前端请求的凭证模式 #

如果你的请求其实不需要携带凭证（比如不需要Cookie），可以直接关闭withCredentials配置：

• 如果你用Angular的HttpClient，修改请求选项：

  this.http.get('https://bla.bla/api/data', { withCredentials: false });
  

• 如果你用Axios，修改全局或请求级配置：

  axios.get('https://bla.bla/api/data', { withCredentials: false });
  

关闭后，服务端用*作为Access-Control-Allow-Origin的值就不会触发这个报错了。

3. 开发环境用Ionic代理绕过跨域（临时方案） #

如果暂时无法修改服务端配置，可以用Ionic内置的代理功能，把前端请求转发到目标服务器，这样浏览器会认为请求是同源的：

1. 在项目根目录的ionic.config.json中添加代理配置：

   {
     "name": "your-app-name",
     "integrations": { ... },
     "proxies": [
       {
         "path": "/api",
         "proxyUrl": "https://bla.bla"
       }
     ]
   }
   

2. 把前端请求的URL从https://bla.bla/api/xxx改成/api/xxx
3. 重启ionic serve，代理就会生效，跨域问题自然消失

额外提醒 #

有时候即使你没手动设置withCredentials，浏览器也会自动携带Cookie（比如目标域名在当前浏览器有已保存的Cookie），这时候也会触发credentials: include模式，导致报错。这种情况下要么清理相关Cookie，要么按方案1修改服务端配置。

内容的提问来源于stack exchange，提问作者GBarroso