浏览器为什么要有同源限制？

同源策略是浏览器最核心的安全机制——限制一个源（协议+域名+端口都相同）的脚本去访问另一个源的资源。

没有同源限制会怎样？你打开了 bank.com 登录了，另一个标签页打开了 evil.com。evil.com 的 JS 可以直接用 fetch 发请求到 bank.com/api/transfer——浏览器会自动带上你的登录 cookie，钱就转走了。同源策略阻止了这个。

同源限制主要限制：1) AJAX 跨域请求；2) 跨 iframe/窗口的 DOM 操作；3) localStorage/Cookie 的跨域访问。

跨域解决方案：CORS（服务端设 Access-Control-Allow-Origin）、JSONP（老方法，利用 script 标签不受同源限制）、代理（同源服务端转发）。

追问

为什么 script/img 标签不受同源限制？

这是历史原因和功能需求——网页需要加载 CDN 上的脚本和图片。但 <script> 加载完会以当前域执行（所以有 XSS 风险），<img> 只能渲染不能读取像素数据（防止窃取）。资源加载的宽松和 API 访问的严格是两个层面的事。

同源策略能防止 CSRF 吗？

不完全能。CSRF 的请求能发出去（form 提交、img 加载都可以跨域），同源策略只阻止 JS 读响应。防止 CSRF 得靠 CSRF Token 或 SameSite Cookie。

跨域请求发出去但响应被拦截，服务端收到请求了吗？

收到了。浏览器是收到响应后发现没有 CORS 头才拦截的。所以服务端需要用 CORS 头来控制，不能用"浏览器会拦截"来保护服务端。