惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

Security Latest
Security Latest
Recorded Future
Recorded Future
人人都是产品经理
人人都是产品经理
S
SegmentFault 最新的问题
Hacker News - Newest:
Hacker News - Newest: "LLM"
C
CXSECURITY Database RSS Feed - CXSecurity.com
博客园 - 三生石上(FineUI控件)
博客园 - 聂微东
P
Privacy & Cybersecurity Law Blog
WordPress大学
WordPress大学
Know Your Adversary
Know Your Adversary
Spread Privacy
Spread Privacy
Threat Intelligence Blog | Flashpoint
Threat Intelligence Blog | Flashpoint
量子位
L
LINUX DO - 热门话题
L
Lohrmann on Cybersecurity
博客园 - Franky
酷 壳 – CoolShell
酷 壳 – CoolShell
T
Tor Project blog
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
雷峰网
雷峰网
阮一峰的网络日志
阮一峰的网络日志
V
Visual Studio Blog
T
Threatpost
T
Tenable Blog
有赞技术团队
有赞技术团队
大猫的无限游戏
大猫的无限游戏
Engineering at Meta
Engineering at Meta
GbyAI
GbyAI
C
Cisco Blogs
H
Heimdal Security Blog
Attack and Defense Labs
Attack and Defense Labs
A
About on SuperTechFans
Last Week in AI
Last Week in AI
N
News and Events Feed by Topic
T
Threat Research - Cisco Blogs
cs.AI updates on arXiv.org
cs.AI updates on arXiv.org
I
Intezer
V
V2EX
Cyberwarzone
Cyberwarzone
cs.CL updates on arXiv.org
cs.CL updates on arXiv.org
B
Blog RSS Feed
V
Vulnerabilities – Threatpost
N
Netflix TechBlog - Medium
T
The Blog of Author Tim Ferriss
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
U
Unit 42
PCI Perspectives
PCI Perspectives
P
Privacy International News Feed
D
Docker

博客园 - 喜欢Ⅰ

先避免毁灭性错误,再谈聪明决策 通往天堂的三个阶梯 人类随机数趣闻 - 即使人们会觉得它更随机,但实际上它更不随机 C 里面如何使用链表 list 项目代码套路 墨菲定律 - 人类一种误判心理 消息队列, 一种取舍的选择 Redis Stream 自我的智慧 市场教父 André Kostolany Exception Handling Considered Harmful MySQL CREATE TABLE Template 模板设计简单交流 字符串转整型 atomic 原子自增工程案例 HTTP 尝试获取 Client IP 对炒股看法 吃饱年代 我是个怎样的人 格林童话之祖父和孙子 Linux 守护进程 智慧 ~ 引子 ~ 三则故事 交易人生 大道至简
CORS 跨域请求一种后端适配解决方案
喜欢Ⅰ · 2025-03-16 · via 博客园 - 喜欢Ⅰ

平常工作难遇到这类问题, 一般搭建新系统或搭建系统二时需要复用系统一一些前后端能力, 可能会遇到跨域拦截问题. 这里提供一种基于服务器解决方案. 更多其他方案, 详细细节可自行查阅更多资料, 写一些前后端交互最小现场.  

首先理解 CORS 跨域拦截是什么回事?

其实一般浏览器请求服务器,会发两次请求:

  1. 第一次 OPTIONS 预检请求,判断是否被允许跨域。
  2. 如果此次通信协议被允许,那么 第二次 真实请求就会被浏览器放行。

注意:涉及这类问题挺复杂的,我所交流和知道细节的也不一定准确,更多是工程实战经验。

知道这个原理,自然也就大致知道解决办法了。

只要 第一次浏览器的 HTTP OPTIONS 协议和服务链交互 OK,那么这个跨域请求就会 PASS 放行

基于后端适配的一种解决方案

# 最小现场交互架构图

+-------------+ +-------------+ +--------------------+
| Browser | <----> | Gateway | <----> | Server |
+-------------+ +-------------+ +--------------------+

Browser 发送 HTTP 请求到最外层 Gateway,Gateway 处理后转发给 Server。

我们大致知道 CORS 问题是怎么回事,只需要保证:

  1. Browser Client 的 HTTP OPTIONS 请求能到达 Gateway 并被正确处理
  2. Gateway 到 Server 的完整链路能够正常处理 OPTIONS 请求

这样跨域问题就可以解决。

这里涉及较多 HTTP 协议交互问题 具体细节可以 和 ChatGPT 进一步沟通 或者 查阅相关资料。

Server 应答 OPTIONS 协议最小可行模板

.... 所有请求进入  (第一优先级拦截器) 下面协 Server 议处理环节

        // 默认全添加 CORS 头, 默认允许跨域访问

        origin := r.Header.Get("Origin")

        if origin == "" {

            origin = "*"

        }

        w.Header().Set("Access-Control-Allow-Origin", origin) // 允许所有来源

        w.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE, UPDATE")

        w.Header().Set("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization")

        w.Header().Set("Access-Control-Expose-Headers", "Content-Length, Access-Control-Allow-Origin, Access-Control-Allow-Headers, Cache-Control, Content-Language, Content-Type")

        w.Header().Set("Access-Control-Allow-Credentials", "true") // 允许跨域携带 Cookie

        // 处理预检请求

        if r.Method == http.MethodOptions {

            w.WriteHeader(http.StatusNoContent)

            return

        }

... 后续转到具体业务服务相关逻辑. 

对于 Gateway 也需要同样的改造, 思路也是类似. 但知易行难, 各行各业都类似.