调用REST API时遭遇Access-Control-Allow-Origin问题求助

我太懂在企业网络环境里卡CORS的痛苦了——明明配置了代理却还是踩坑，这种情况真的让人头大。先梳理下你的场景：你想调用OpenWeatherMap的每日天气API生成折线图，API地址是https://samples.openweathermap.org/data/2.5/forecast/daily?id=524901&appid=b1b15e88fa797225412429c1c50c122a1，但一直被Access-Control-Allow-Origin错误拦截，已经写了proxy.config.js却没解决，从你附上的错误截图也能看到典型的浏览器跨域拦截提示：

结合你的代理配置和企业网络的特殊性，我整理了几个针对性的修复步骤：

1. 补全代理环境变量的兼容逻辑 #

你的代码只处理了http_proxy/HTTP_PROXY，但企业网络的HTTPS代理通常会用https_proxy/HTTPS_PROXY变量，这可能导致代理没生效。修改setupForCorporateProxy函数：

var HttpsProxyAgent = require('https-proxy-agent');
var proxyConfig = [{
  context: '/data', // 改成更具体的API前缀，避免不必要请求走代理
  target: 'https://samples.openweathermap.org',
  secure: false,
  changeOrigin: true // 关键：让目标服务器收到正确的Host头
}];

function setupForCorporateProxy(proxyConfig) {
  // 同时兼容http和https的代理环境变量
  var proxyServer = process.env.http_proxy || process.env.HTTP_PROXY || 
                    process.env.https_proxy || process.env.HTTPS_PROXY;
  if (proxyServer) {
    var agent = new HttpsProxyAgent(proxyServer);
    console.log('Using corporate proxy server: ' + proxyServer);
    proxyConfig.forEach(function(entry) {
      entry.agent = agent;
    });
  }
  return proxyConfig;
}

module.exports = setupForCorporateProxy(proxyConfig);

2. 确保前端请求走代理路径 #

别直接在代码里写完整的外部API地址，改用相对路径让请求走本地代理：

// 错误写法（直接跨域请求，触发CORS）
fetch('https://samples.openweathermap.org/data/2.5/forecast/daily?id=524901&appid=b1b15e88fa797225412429c1c50c122a1')

// 正确写法（走本地代理转发）
fetch('/data/2.5/forecast/daily?id=524901&appid=b1b15e88fa797225412429c1c50c122a1')

3. 确认代理配置已正确加载 #

如果是Angular这类框架，启动项目时必须指定代理配置文件：

ng serve --proxy-config proxy.config.js

其他框架（比如React）要确保http-proxy-middleware这类中间件已经正确引入并加载了你的配置。

4. 处理企业SSL证书拦截 #

如果企业网络用了自签名证书做流量拦截，除了secure: false，还需要临时跳过Node.js的证书验证（生产环境建议配置信任企业根证书）：

NODE_TLS_REJECT_UNAUTHORIZED=0 npm start

按这几步调整后，应该能绕过企业网络的限制解决CORS问题了。

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