持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第26天,点击查看活动详情
11.1 跨域访问
跨域指的是浏览器不能执行其他网站的脚本,当一个请求url的协议、域名、端口三者有任意一个不同即为跨域
无法跨域是由浏览器的同源策略造成的,是浏览器对Javascript施加的安全限制
| URL | 跨域原因说明 |
|---|---|
| www.x.com 与 www.y.com | 不同域名 |
| www.x.com:8080 与 www.x.com:8081 | 不同端口 |
| www.x.com 与 www.def.x.com | 子域名不同 |
| www.x.com 与 www.x.com | 不同协议 |
11.2 同源策略
同源策略(Sameoriginpolicy)是一种行为,由Netscape公司1995年引入浏览器,同源策略会阻止非同源的内容进行交互,目的是为了保护本地数据不被JavaScript代码获取回来的数据污染,防范XSS、CSFR等攻击
同源是指协议、域名、端口三者均为相同,浏览器使用OPTIONS方法发送检测请求,获知服务器是否允许该跨域请求,如果不允许发送带数据的真实请求,则会受到限制
- Cookie、LocalStorage 和 IndexDB 无法读取
- DOM 无法获得
- AJAX 请求不能发送
11.3 跨域解决方案
JSONP(JSON with Padding)是 JSON 的一种使用模式,利用script这个开放策略(标签),网页可以得到从其他来源动态产生的 JSON 资料,以此实现跨域原理,但只能发起GET请求
Nginx反向代理(Reverse Proxy)是指客户端不需要任何配置就可以访问,将请求发送到反向代理服务器获取数据后,再返回给客户端,由此把跨域转换成不跨域,支持各种请求方式
CORS跨域资源共享(Cross-origin resource sharing)是指在服务器端定义跨域请求规则,允许控制浏览器向跨域服务器发出请求,支持各种请求方式