Webpack Dev Server代理失效，请求代理时出现500错误

这个UNABLE_TO_VERIFY_LEAF_SIGNATURE错误本质是SSL证书链验证失败导致的——哪怕你已经设置了secure: false，有时候Webpack Dev Server底层依赖的http-proxy-middleware还是会卡在证书链的校验上。下面是亲测有效的解决方案：

1. 添加自定义HTTPS Agent绕过证书验证 #

首先在你的webpack配置文件顶部引入Node.js的https模块，然后给代理配置加上agent选项，彻底禁用证书链的校验：

// webpack.config.js 文件顶部
const https = require('https');

// 代理配置部分
proxy: {
  "^/abc/v1/**": {
    target: "https://my-services.net/",
    changeOrigin: true,
    secure: false,
    // 关键配置：跳过证书链完整性验证
    agent: new https.Agent({
      rejectUnauthorized: false
    })
  }
}

为什么要这么做？secure: false只是告诉代理不要验证目标证书是否由受信任的CA颁发，但底层的HTTPS请求仍会检查证书链的完整性。加上rejectUnauthorized: false的Agent，才能完全跳过这一步验证。

⚠️ 重要提醒：这个配置仅适合开发环境使用！生产环境绝对不能这么设置，会带来严重的安全风险。

2. 额外排查点 #

如果上面的配置还是不行，可以检查以下几点：

• 确认目标服务器地址https://my-services.net/是否拼写正确，有没有漏掉路径或端口
• 目标服务器是否需要特定请求头（比如Authorization、X-API-Key），可以在代理配置里添加headers字段传递这些信息：

  proxy: {
    "^/abc/v1/**": {
      // 其他配置...
      headers: {
        'Authorization': 'Bearer YOUR_DEV_TOKEN',
        'X-Requested-With': 'XMLHttpRequest'
      }
    }
  }
  

• 检查本地是否有代理工具（比如Charles、Fiddler）在运行，这类工具的自签名证书可能会干扰验证，暂时关闭试试

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