概念
跨域是个老生常谈的问题,指的是网页中的JS
想去请求非自己域内的数据或者操作非自己域内的DOM对象
,说起来有抽象,就好比
- 监狱内的犯人想去监狱外买点水果回来牢里吃
- 监狱内的犯人想搜狱警大人的口袋
以上两种神操作一般情况下当然是行不通的!
原因
用脚指头想想都知道的,因为这是规定!
谁规定的
- 代码世界里当然是浏览器规定的,现实世界里当然是监狱规定的
- 对于第一种情况:即请求本域外的数据,请求能发出去,服务器也能正常返回,但是浏览器把数据拦截了、拦截了、拦截了!
- 对于第二种情况:操作非自己域内的`DOM对象:很简单,连那个DOM对象你都获取不到!获取不到!获取不到!
又有抽象?
就好比:
- 狱警把你托人在外买的水里给默收然后自己吃掉了,在电影里也是有挺多这种操作的,常规操作!
- 犯人根本就碰不到狱警,因为犯人大部分时间是被关起来的
同域
现实世界里当然指的是同个牢房啦!
而浏览器世界里指的是同协议并且同域名并且同端口号
,俗称三证齐全
,比如http
、taobao.com
、80
,也叫做浏览器的同源策略,目的当然是为了:
- 保证狱警的安全
- 怕情绪不稳定的家属跑进来暴打狱友
解决方法
规定是死的,但人是活的,只要人活着,总有办法的嘛!
而绕过浏览器的同源策略就叫做跨域了!
因此跨域也有各种姿势,各显神通!
比如JSONP
就好比贿赂狱警,这个大家都懂的,不说了!
比如CORS
就好比官方授权,这个大家也懂的,也不说了!
具体操作细节感觉如果是我自己写的话估计没法超越以下这篇好文了:
九种跨域方式实现原理