同源策略与跨源策略

1. 同源策略

同源策略是指在Web浏览器中允许某个网页脚本访问另一个网页的数据但前提是这两个网页必须有相同的URI、主机名和端口号一旦两个网站满足上述条件这两个网站就被认定为具有相同来源。

此策略可防止某个网页上的恶意脚本通过该页面的文档对象模型访问另一网页上的敏感数据。 同源策略对Web应用程序具有特殊意义因为Web应用程序广泛依赖于HTTP cookie来维持用户会话所以必须将不相关网站严格分隔以防止丢失数据泄露。

值得注意的是同源策略仅适用于脚本这意味着某网站可以通过相应的HTML标签访问不同来源网站上的图像、CSS和动态加载脚本等资源。而跨站请求伪造就是利用同源策略不适用于HTML标签的缺陷。 ​

2. 如何进行跨域

1CORS

CORS的本质

a. 简单请求

A 通过响应头告诉浏览器我愿意共享给 B

b. 复杂请求

为了防止 POST/PUT/PATCH 请求对数据造成影响

浏览器会先发 OPTIONS 请求问 A 接不接受 POST/PUT/PATCH

如果接受浏览器才会发真正的请求

比如 post 请求的功能是打款给他人

2JSONP

a. 取巧

由于 <script> 标签不受同源策略约束可以请求任意 JS

所以后端把数据直接放在 JS 里了 对回调的使用是 JSONP 的点睛之笔

b. 与 JSON 的关系

毫无关系

3反向代理

步骤

假设 a.com:8888 想把 GET /data 共享给 b.com:7777

1. b.com 后端提供一个 /dataNginx 配置如右

2. b.com 前端通过 AJAX 访问 b.com/data

3. b.com/data 向 a.com/data 发请求得到响应之后给 b.com 的前端