为什么小明刚入职就碰到跨域问题然后转身离职?

7,074 阅读2分钟

故事的开始

故事还要从某个大厂的前端工程师 小明 说起。

小明兴高采烈的入职了某大厂的前端工程师岗位,就小明的水平的话,写写前端代码不在话下。

周四这天,小明吃完肯德坤之后,打开电脑浏览器,刷新页面,控制台就出现了下面的报错信息:

QQ_1733404303364.png

小明摸了摸自己大大的鼻子,一眼就看到了问题:

demo.hamm.cn 访问 api.hamm.cn 跨域了。

凭借多年的经验,小明瞬间就想到了解决方案:

那就摇人

因为刚入职,碰到这个问题他也不知道该找哪个人来处理,因为他没有 API 服务器的权限,于是在群里说了一句:

小明(前端):“哪位大哥帮忙配置下跨域, api.hamm.cn 需要允许来自 demo.hamm.cn 的跨域请求。”

三分钟后...

小贾(Java):“收到,我看看”

小董(运维):“好的,现在在外面,半小时后回”

五分钟后,小明收到了来自 Java 同学 小贾 的私聊

小贾(Java):“好的,已配置好跨域头,你看看”

小明(后端):“咦,可以了。感谢大哥!”

出幺蛾子了

半小时后,运维的 小董 同学回到公司,马不停蹄的给配了跨域头。

刚准备私聊告诉小明,却见 Java 的小贾同学在群里 @ 自己:

小贾(Java):“@小董(运维) 董哥,你的网关侧是不是有问题,我配置了跨域头,小明这边刚才还好好的可以跨域,这会又炸了。。。”

只见小明发了张图:

QQ_1733404994187.png

群里炸锅了

咦,两个请求头

QQ_1733405055850.png

怎么请求头两个了之后反而跨域失败了呢?

查找问题

运维哥 和 Java哥 一脸懵,于是开始查找问题。

只见小明不慌不忙的在群里 @ 了两人:

小明(前端):“@小董(运维) @小贾(Java) 两位哥,你们俩应该都配置了跨域头,两个跨域头也会跨域失败的哦~”

小董(运维):“@小贾(Java) 你应用服务里的去掉吧”

小贾(Java):“...”,心想 不是我先配置的么,凭什么。。。

你们都是在网关侧还是业务侧配置的允许跨域呢?欢迎评论区讨论

多跨域头禁止跨域

原来,多跨域头下,浏览器认为数据可能是被中间代理过,觉得不够安全,所以禁止了跨域访问。

MDN关于跨域 origin 的解释:

developer.mozilla.org/zh-CN/docs/…

第二天

小明递上了自己的离职申请书。