WuEasy Gateway

外观

跨域配置指南 🌐 ​

什么是跨域？ 🤔 ​

想象一下这个场景：

  • 🏢 你的网站就像一个办公大楼（域名A）
  • 🏬 其他网站就像其他大楼（域名B、C、D...）
  • 📨 跨域请求就像在不同大楼之间传递文件
  • 🚫 浏览器的同源策略就像大楼的安保系统，默认阻止跨楼传递

基础配置 📝 ​

快速上手配置 ​

最简单的配置方式（开发环境推荐）：

yaml
spring:
  cloud:
    gateway:
      globalcors:
        corsConfigurations:
          '[/**]':
            allow-credentials: true            # 允许携带认证信息
            allowed-origin-patterns: "*"       # 允许所有来源访问
            allowed-methods: "*"               # 允许所有HTTP方法
            allowed-headers: "*"               # 允许所有请求头
            max-age: 3600                     # 预检请求有效期（秒）
      default-filters:
        - DedupeResponseHeader=Access-Control-Allow-Origin, RETAIN_UNIQUE

生产环境配置 ​

更安全的配置方式（生产环境推荐）：

yaml
spring:
  cloud:
    gateway:
      globalcors:
        corsConfigurations:
          '[/**]':
            allow-credentials: true
            allowed-origin-patterns:           # 明确指定允许的域名
              - "https://www.yourdomain.com"
              - "https://api.yourdomain.com"
            allowed-methods:                   # 指定允许的HTTP方法
              - GET
              - POST
              - PUT
              - DELETE
            allowed-headers:                   # 指定允许的请求头
              - Authorization
              - Content-Type
            max-age: 3600
      default-filters:
        - DedupeResponseHeader=Access-Control-Allow-Origin, RETAIN_UNIQUE

配置说明 📖 ​

1. 核心参数解释 ​

参数说明示例值
allow-credentials是否允许携带认证信息（如cookie）true
allowed-origin-patterns允许访问的源地址["https://www.example.com"]
allowed-methods允许的HTTP请求方法["GET", "POST"]
allowed-headers允许的请求头["Authorization"]
max-age预检请求缓存时间（秒）3600

2. 特殊场景配置 ​

2.1 允许多个特定域名 ​

yaml
allowed-origin-patterns: 
  - "https://www.example.com"
  - "https://api.example.com"
  - "http://localhost:8080"

2.2 限制特定HTTP方法 ​

yaml
allowed-methods:
  - GET
  - POST
  - OPTIONS

安全建议 🛡️ ​

1. 生产环境注意事项 ​

  • ⚠️ 不要使用 "*" 通配符
  • 🔒 明确指定允许的域名
  • 📝 限制必要的HTTP方法
  • ⏰ 设置合理的预检有效期

2. 常见安全隐患 ​

  • 🚨 过于宽松的跨域配置
  • 🔓 不必要的HTTP方法开放
  • 🎯 未限制请求头
  • 🍪 不当的凭证配置

常见问题 ❓ ​

1. 跨域请求被拒绝 ​

检查以下几点：

  • ✓ 请求的域名是否在允许列表中
  • ✓ 使用的HTTP方法是否允许
  • ✓ 请求头是否在允许列表中
  • ✓ 是否需要携带认证信息

2. Cookie无法传递 ​

解决方案：

  • ✓ 确保 allow-credentials 设置为 true
  • ✓ 前端请求配置 withCredentials: true
  • ✓ 不能使用 "*" 作为 allowed-origin-patterns

调试技巧 🔍 ​

1. 浏览器调试 ​

  1. 打开开发者工具 (F12)
  2. 查看 Network 面板
  3. 检查请求头和响应头
  4. 查看 Console 错误信息

2. 常见错误信息 ​

Access to XMLHttpRequest has been blocked by CORS policy
  • 检查域名配置
  • 验证请求方法
  • 确认请求头设置

最佳实践 💡 ​

  1. 分环境配置

    • 开发环境可以适当宽松
    • 测试环境模拟生产配置
    • 生产环境严格控制

  2. 定期审查

    • 检查允许的域名列表
    • 审查开放的HTTP方法
    • 评估安全风险

  3. 监控告警

    • 记录异常的跨域请求
    • 监控请求量变化
    • 设置安全告警

需要帮助？🆘 ​

如果遇到问题：

  1. 检查浏览器控制台
  2. 查看网关日志
  3. 联系技术支持

Copyright © 2017-2025 wueasy.com