同域约炝是啥子？咋个在四川话里头整明白？

你点开一个链接，跳转到另一个网页，结果发现地址栏还是同一个域名——这叫同域约炝？

等等，约炝？是“约请”还是“炝锅”？还是“约炮”的谐音梗？兔哥第一次看到这个词也懵了，翻了三页文档才晓得：根本不是“约炝”，是“约”+“同域”+“重定向”的口误混搭体！ 实际上，说的是「同域内页面跳转时的权限控制机制」，但大家伙儿嘴瓢喊快了，就成了“同域约炝”……

所以第一个问题来了——

同域约炝到底是啷个回事？

简单讲：就是你在www.sichuan.com/laoba这个页面点一个链接，跳到www.sichuan.com/chengdu，两个网址开头一模一样（同域），浏览器就放心大胆让你跳，不拦你、不报错、不弹窗。

但要是你点到www.beijing.com/chaoyang——好嘛，跨域了！ 浏览器立马皱眉头：“你没得授权，不准乱跑！”

> ✅ 同域 = 协议+域名+端口都一样（比如都是http://sichuan.com:443）

> ❌ 不同域 = 任意一项对不上（http vs http、sichuan.com vs www.sichuan.com、80 vs 8080）

场景	是不是同域	浏览器咋反应
`http://sichuan.com/a` → `http://sichuan.com/b`	✅ 是	放行，丝滑跳转
`http://sichuan.com` → `http://sichuan.com`	❌ 否（协议不同）	可能拦截，尤其现代浏览器
`http://sichuan.com` → `http://www.sichuan.com`	❌ 否（子域不同）	默认拦！除非显式配CORS或document.domain
`http://sichuan.com:8080` → `http://sichuan.com:3000`	❌ 否（端口不同）	拦！哪怕本地调试也常踩这个坑

---

为啥要搞同域约炝？不是多此一举？

不是多余，是保命机制！

你想哈子：要是随便一个网页都能偷偷读你银行网银的cookie、调你微信后台接口、扒你本地localStorage……那还得了？

所以浏览器定下铁规矩：同域才认亲，跨域要打报告。

就像你家门钥匙只开自己屋头的锁，不可能拿去开隔壁王婆婆家的防盗门，对不对？

但有些朋友想要跨域传数据咋办？

→ 有法子！比如：

后端加Access-Control-Allow-Origin: *（慎用！别把敏感接口全放开）

前端用postMessage跟iframe通信（安全又灵活）

或者干脆用代理服务器“假装同域”（开发时常用webpack devServer.proxy）

---

四川话实操小贴士：你写代码的时候要注意啥？

兔哥在成都改bug的时候经常遇到这些事儿：

本地localhost:3000调后端localhost:8000？❌ 跨域！

你把前端丢到sichuan.com，后端接口却写成api.sichuan.com？❌ 子域不同！

用了.href = 'http://sichuan.com/login'——放心，这是导航跳转，不涉及AJAX请求，所以不触发跨域检查！

但你用fetch('/api/user')，而当前页面是http://sichuan.com，后端在http://api.sichuan.com——这时候就该配CORS了！

⚠️ 注意：同域 ≠ 同二级域名！

sichuan.com 和 www.sichuan.com 在浏览器眼里，就是两家人。

你非要说他们是亲戚？可以，但得手动配：

// 在主域页面里写（注意顺序！）
document.domain = 'sichuan.com';

然后所有子域页也要同步写这句——但仅限于老式iframe通信，现在新项目基本不用了。

---

兔哥的真心话

说实话，刚学前端那阵，我天天被跨域报错整得脑壳疼，连“同源策略”四个字都念不利索，更别说“同域约炝”这种民间黑话了……

后来才晓得：技术术语不怕记不住，怕的是不理解它为啥存在。

它不是为了刁难你，是为了让你写的网站，不变成黑客的跳板。

所以啊，别光想着“咋绕过”，多想想“啷个守规矩还能把事干成”。

配置CORS、用proxy、拆接口、做BFF层……路子多得很，关键是要心里有数，手上不慌。

希望能帮到你。

分享让更多人看到