API网关流量转发踩坑总结

API网关流量转发踩坑总结

最近在公司项目中部署React微服务API网关时，遇到了一系列流量转发的坑，分享给大家避免踩雷。

问题一：跨域配置失效

最初使用Nginx作为网关时，发现前端请求总是报跨域错误。排查后发现是缺少了关键的headers配置：

location /api/ {
    proxy_pass http://backend-service;
    add_header Access-Control-Allow-Origin *;
    add_header Access-Control-Allow-Methods "GET, POST, PUT, DELETE, OPTIONS";
    add_header Access-Control-Allow-Headers "Content-Type, Authorization";
}

问题二：路由匹配优先级混乱

在配置多个路由规则时，发现请求总是被错误的路由处理。比如：

// 错误配置
const routes = [
  { path: '/api/users', handler: userHandler },
  { path: '/api/users/:id', handler: userDetailHandler }
]

正确的做法是按照路径长度排序，或者使用正则匹配：

// 正确配置
const routes = [
  { path: '/api/users/:id', handler: userDetailHandler },
  { path: '/api/users', handler: userHandler }
]

问题三：请求头丢失

微服务间调用时，发现部分header信息在转发过程中丢失。通过添加以下配置解决：

location / {
    proxy_pass http://backend;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
}

问题四：缓存策略不当

在测试阶段发现接口响应缓慢，后来发现是缓存配置有问题。正确的缓存配置应该避免对API请求进行缓存：

location ~* \.(js|css|png|jpg|jpeg|gif|ico)$ {
    expires 1y;
    add_header Cache-Control "public, immutable";
}

location /api/ {
    proxy_cache off;
    proxy_no_cache 1;
}

建议在实际部署前，先用curl测试各个路由的转发效果，避免生产环境出现意外。