Echo框架配置CORS中间件后仍返回No 'Access-Control-Allow-Origin'报错如何解决

问题排查与解决步骤 #

• 优先检查中间件注册顺序
  CORS中间件必须注册在所有会拦截请求的中间件（如鉴权、限流中间件）之前，也要早于路由定义环节。如果先注册其他拦截类中间件、先定义路由再注册CORS中间件，会导致CORS逻辑完全不生效。
  正确注册顺序示例：

srv := echo.New()
srv.HideBanner = true
// 最先注册CORS中间件
srv.Use(middleware.CORSWithConfig(DefaultCORSConfig))
// 再注册其他中间件
srv.Use(middleware.Logger())
// 最后定义路由
srv.GET("/myAPI", myAPIHandler)

• 删除自定义OPTIONS路由逻辑
  如果你的代码里单独为OPTIONS方法写了路由处理函数，会覆盖CORS中间件的默认预请求处理逻辑，导致返回的预请求响应没有CORS相关头，直接删除自定义的OPTIONS路由即可。

• 修正CORS配置项

  1. AllowOrigins要填完整的源地址，不要缺协议、不要加多余的尾斜杠，比如允许本地3000端口要写[]string{"http://localhost:3000"}，不要写成"localhost:3000"或者"http://localhost:3000/"
  2. 你当前配置的AllowHeaders里添加了echo.HeaderAccessControlAllowOrigin、echo.HeaderAccessControlAllowMethods两个响应头，这部分是冗余配置，AllowHeaders只需列允许客户端发送的请求头即可，删掉这两项即可
  3. 如果你的fetch请求带了credentials: include配置需要跨域传cookie，不能用*作为AllowOrigins，必须明确指定允许的源，同时要新增AllowCredentials: true配置项，示例：

  var CORSConfig = middleware.CORSConfig{
      AllowOrigins: []string{"http://localhost:3000"},
      AllowMethods: []string{http.MethodGet, http.MethodHead, http.MethodPut, http.MethodPatch, http.MethodPost, http.MethodDelete, http.MethodOptions},
      AllowHeaders: []string{echo.HeaderOrigin, echo.HeaderContentType, echo.HeaderAccept, "Authorization"}, // 按需添加你用到的自定义请求头
      AllowCredentials: true,
  }
  

• 排查请求是否被提前终止
  如果你在前置中间件里调用了c.JSON()、c.String()等返回响应的方法后没有返回nil，或者直接返回了非nil的错误，会导致后续CORS中间件逻辑未执行，响应头不会被注入CORS相关配置。

你可以用以下curl命令直接测试预请求的返回头，验证配置是否生效：

curl -I -X OPTIONS -H "Origin: http://localhost:3000" -H "Access-Control-Request-Method: GET" http://localhost:8080/myAPI

正常返回的响应中应包含Access-Control-Allow-Origin对应的头信息。

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