生产环境缺失X-Requested-With Header问题排查（AWS ALB+ECS+EC2）

问题核心分析 #

jQuery默认会给同域AJAX请求自动添加X-Requested-With: XMLHttpRequest头，但跨域场景下如果后端CORS策略未明确允许该头，jQuery会自动移除它。这就是你遇到的差异：开发环境是同域请求，头正常发送；生产环境大概率存在跨域（域名/端口不一致）或CORS配置缺失，导致头被丢弃，Laravel无法识别为AJAX请求，因此不返回JSON。

解决方案步骤 #

1. 先确认是否存在跨域场景

• 打开Chrome开发者工具「Network」面板，查看目标请求的Headers→Request Headers，检查是否有Origin字段：如果该字段值和当前页面域名（含协议、端口）不一致，就是跨域请求。

2. 在Laravel后端配置CORS允许X-Requested-With头

AWS ALB本身无专门的CORS配置入口，直接通过Laravel框架处理更可靠：

• 修改config/cors.php配置文件，明确添加允许的头：

  return [
      'paths' => ['api/*', '/*'], // 根据你的实际路由范围调整
      'allowed_methods' => ['*'],
      'allowed_origins' => ['https://your-production-frontend.com'], // 生产环境务必指定具体域名，不要用*
      'allowed_origins_patterns' => [],
      'allowed_headers' => ['Content-Type', 'X-Requested-With'], // 强制加入X-Requested-With
      'exposed_headers' => [],
      'max_age' => 3600,
      'supports_credentials' => false,
  ];
  

• 确保目标路由组应用了cors中间件，比如在routes/web.php或routes/api.php中：

  Route::middleware(['cors'])->group(function () {
      // 包含datatables调用的所有接口路由
  });
  

• 生产环境部署时，执行配置缓存命令：php artisan config:cache（容器化部署的话，建议在镜像构建阶段执行）

3. 全局配置jQuery强制发送请求头

Datatables基于jQuery发起请求，你可以全局设置AJAX规则，强制带上该头（即使跨域，只要后端允许就会生效）：
在前端全局JS文件（比如Metronic的自定义脚本文件）中添加：

$.ajaxSetup({
    headers: {
        'X-Requested-With': 'XMLHttpRequest'
    },
    crossDomain: true // 确认是跨域请求时开启
});

4. 检查AWS ALB的转发规则

进入AWS控制台的ALB页面，查看「Listeners」→「Rules」：

• 确认没有Modify headers类的规则在移除X-Requested-With头；
• 如果ALB有自定义请求头添加规则，也不要覆盖或删除该头。

5. 验证配置生效

请求发送后，在Chrome开发者工具中查看：

• 请求头是否存在X-Requested-With: XMLHttpRequest；
• 响应头是否包含Access-Control-Allow-Origin（匹配前端域名）和Access-Control-Allow-Headers（包含X-Requested-With）。

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