尧图网站建设 尧图网络
  • 首页
  • 关于我们
  • 服务项目
  • 案例展示
  • 建站流程
  • 资讯中心
  • 联系我们
首页/资讯中心/详情

cors跨域疑问解决

cors跨域疑问解决
📅 发布时间:2026/6/24 16:23:25

golang后端框架gin如果设置了分组的group请求前缀,跨域有些不一样。

r1 := gin.Default()r := r1.Group("/game")webSocket := server.NewWebSocket()r1.NoRoute(cors.New(cors.Config{AllowOrigins: allowOrigins,AllowMethods: []string{"GET", "POST", "PUT", "PATCH", "DELETE", "HEAD", "OPTIONS"},AllowHeaders: []string{"*",},AllowCredentials: true,MaxAge:           12 * time.Hour,},))// websocket单独处理,正常http请求按照router.Register方式来写r.Use(cors.New(cors.Config{AllowOrigins: allowOrigins,AllowMethods: []string{"GET", "POST", "PUT", "PATCH", "DELETE", "HEAD", "OPTIONS"},AllowHeaders: []string{"*",},AllowCredentials: true,MaxAge:           12 * time.Hour,},),).Use(TraceIDHandler()).Use(timeoutMiddleware()).Use(gin.CustomRecovery(customRecoveryHandler)).Use(RequestUserInfo()).Use(RequestLogMiddleware()).Use(ResponseHeaderSet())
r.Group.POST(path, r.Handle)

通过查看

r.Group.POST(path, r.Handle)的源码得知:
func (group *RouterGroup) handle(httpMethod, relativePath string, handlers HandlersChain) IRoutes {absolutePath := group.calculateAbsolutePath(relativePath)handlers = group.combineHandlers(handlers)group.engine.addRoute(httpMethod, absolutePath, handlers)return group.returnObj()
}

如果写了

r.POST(path, r.Handle),则以上源码中的
group.engine.addRoute(httpMethod, absolutePath, handlers)
只会将post方法对应的跨域用的cors的handler来处理注册到engine中。而对于options方法的请求是不会用这个handlers来处理的。

如果想解决此问题,有两个方案:
1. 对于post/get等请求,不只是写

r.POST(path, r.Handle),而是增加r.OPTIONS(path, r.Handle),将options也写入到engine的处理的method中

2. 增加这个方法:

r1.NoRoute(cors.New(cors.Config{AllowOrigins: allowOrigins,AllowMethods: []string{"GET", "POST", "PUT", "PATCH", "DELETE", "HEAD", "OPTIONS"},AllowHeaders: []string{"*",},AllowCredentials: true,MaxAge:           12 * time.Hour,},
))

这是告诉engine。如果存在不理解的method。则用norout中定义的hanlder处理。那么我们这里定义了cors的hanlder方法。因为options没有在engine中注册过,因此会采用这个noroute中注入的hanler cors来处理。也满足条件。我在代码中就是用的这种方式

二. 进入cros的判断

如果前端发送请求时没有配置credentials: 'include'。则前端的header中即使有'Authorization': 'Bearer xxxx'头,浏览器依然不认为则是一个'带有凭据'的请求。

1. 如果不设置credentials: 'include',则后端设置AllowOrigins具体的域名,AllowHeaders设置为*,都可以通过跨域请求


但是如果如下设置:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>跨域测试页面</title>
    <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<h1>跨域测试</h1>
<div>
    <input type="button" οnclick="mySubmit()" value=" 发送跨域请求 ">
</div>
<script>
    function mySubmit() {
fetch("http://localhost:8082/game/v1/new_game", {
        method: "POST",
        credentials:"include",
        headers: {
            'Content-Type': 'application/json; charset=utf-8',
            'Authorization': 'Bearer xxxx'
        },
        body: JSON.stringify({"name": "Java"})
    })
    .then(response => response.json())
    .then(result => alert("返回数据:" + result.data))
    .catch(error => console.error('Error:', error));
    }
</script>
</body>
</html>

增加了credentials:"include",

根据cors的规范:

禁止在Access-Control-Allow-Origin: *
Access-Control-Allow-Credentials: true的时候,前端发送带有凭据的请求能够通过cros。


2. 实际测试过程中发现会更严格;
即使设置了AllowOrigins,但是AllowHeaders设置为*。也是无法通过跨域请求的。

r1.NoRoute(cors.New(cors.Config{AllowOrigins: allowOrigins,AllowMethods: []string{"GET", "POST", "PUT", "PATCH", "DELETE", "HEAD", "OPTIONS"},AllowHeaders: []string{"*",},AllowCredentials: true,MaxAge:           12 * time.Hour,},
))

必须指定AllowHeaders。同时,不能只设置r1.NoRoute,对实际的post请求也要设置好,也就是

r.Use(也要对AllowHeaders进行指定。

3. 通过测试来看,似乎前端不增加 credentials:"include",的话,后端的

AllowHeaders选择通配符是能够跨域成功的。

相关新闻

  • 2025年焊接变位机厂家最新权威推荐榜:双轴变位机专业制造商,高效稳定助力智能焊接升级
  • 2025年法兰罩厂家最新权威推荐榜:专业防护与精密制造,工业管道安全守护者优选品牌
  • 最佳实践:基于Apache SeaTunnel从MySQL同步到PostgreSQL

最新新闻

  • RedNotebook:一款强大易用的跨平台日记应用,助你轻松管理个人知识
  • 智谱GLM-5.2与万亿港元市值:国产大模型首个破万亿港元的资本市场里程碑
  • 30天自制操作系统完全指南:从零构建OSASK操作系统的终极教程
  • python-rapidjson:给 Python 塞进一台 C++ 引擎
  • 我学会了怎么写类,但到底什么时候该用类?
  • Coder:自托管云开发环境,让AI代理在你的服务器上写代码

日新闻

  • 利用微PE工具箱进行系统安装教程
  • 渗透测试十大核心工具实战指南:从信息搜集到报告生成全流程解析
  • 暗黑破坏神2存档编辑器:网页版角色修改工具完全指南

周新闻

  • Visual C++运行库修复终极指南:5分钟快速解决Windows软件启动错误
  • 手把手教你构建统计局地区经济数据爬虫:从环境搭建到数据持久化全指南
  • 2026多Agent深度解析:用AI团队替代单一模型,四种架构实战落地

月新闻

  • 【总结】入门篇:50句话让你记住架构核心概念
  • WeChatMsg技术方案解析:实现Mac微信数据自主管理的完整解决方案
  • WeChatMsg:革新性微信数据备份方案,打造你的专属数字记忆库

关于尧图

  • 公司简介
  • 团队介绍
  • 企业文化
  • 荣誉资质

服务项目

  • 定制开发
  • 电商建站
  • UI 设计
  • 运维服务

快速链接

  • 案例展示
  • 建站流程
  • 常见问题
  • 资讯中心

联系方式

  • 📍北京市朝阳区互联网产业园 A 座 10 层
  • 📞400-888-8888
  • ✉️contact@rkmt.cn
  • 🕐周一至周日 9:00-21:00

© 2024 北京尧图网络科技有限公司 版权所有 | 京 ICP 备 XXXXXXXX 号