桌面模拟器API调用正常，Edge/Chrome报XMLHttpRequest错误求助

• 报错信息：ClientException: XMLHttpRequest error., uri=http://localhost:3000/api/users/allUsers
• 问题现象：桌面模拟器中调用该API可正常工作，但在Edge/Chrome浏览器中无法运行。
• 相关代码：

class UserDao {   
  static const baseUrl = "http://localhost:3000/api"; 
  //Get All Users   
  static Future<List<UserModel>?> getAllUsers() async {
    try {
      final resp = await http.get(
        Uri.parse("$baseUrl/users/allUsers"),
        headers: {
          "Accept": "application/json",
          "Access-Control_Allow_Origin": "*",
          "Access-Control-Allow-Headers": "Access-Control-Allow-Origin, Accept"
        },
      );
      var listUser = json.decode(resp.body);
      List<UserModel> users = [];
      listUser.forEach((user) {
        UserModel u = UserModel(
          idUser: user['id_user'],
          firstName: user['firstName'],
          lastName: user['lastName'],
          email: user['lastName'],
          password: user['password']);
        users.add(u);
      });
      return users;
    } 
    catch (err) {
      print(err);
      return null;
    }   
  } 
}

1. 清理请求头中的无效字段
   请求里加的Access-Control_Allow_Origin和Access-Control-Allow-Headers是服务器返回给浏览器的响应头，不是客户端该发送的请求头，完全无效，直接删掉。修改后的请求头只需保留：

   headers: {
     "Accept": "application/json",
   },
   

2. 后端配置CORS允许跨域
   浏览器有同源策略限制，不同端口的前端和后端直接通信会被拦截，必须在后端（localhost:3000的服务）配置CORS：

   • 若使用Node.js/Express，安装cors包后直接启用：

     const cors = require('cors');
     const express = require('express');
     const app = express();
     
     app.use(cors()); // 开发环境允许所有来源，生产环境需指定具体前端域名
     

   • 其他后端框架找对应的CORS配置方法，核心是让服务器返回Access-Control-Allow-Origin响应头，值为前端域名或者*（仅开发环境使用）。

3. 临时调试方案（仅开发用）
   如果后端暂时无法修改，可以安装浏览器插件临时禁用CORS检查，比如Chrome的「Allow CORS: Access-Control-Allow-Origin」，但这仅用于调试，上线必须依赖后端配置。

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