跨域
1、基本概念
- 向一个域发送请求,如果要请求的域和当前域是不同域,就叫跨域
- 不同域之间的请求,就是跨域请求,跨域请求一般会被浏览器阻止掉
- 阻止跨域请求,是浏览器本身的一种安全策略(同源策略:只能请求同域下的url地址)
- 其他客户端或者服务器都不存在跨域被阻止的问题
2、怎么判断是否同域
以 https://www.imooc.com :443 /course/list 为例:
- https:协议
- www.imooc.com :域名
- 443 :端口号
- course/list :路径
- 只要 协议、域名、端口号,任何一个不同,就是不同域;是否同域与路径无关
3、跨域解决方案
(1)方案一:CORS跨域资源共享
- 使用CORS跨域的过程:
①浏览器发送跨域请求
②后端在响应头中添加Access-Control-Allow-Origin头信息
Access-Control- Allow-Origin: *
表明允许所有的域名来跨域请求它, *是通配符,没有任何限制
只允许指定域名的跨域请求
Access-Control-Allow-Origin: http://127.0.0.1:5500
③浏览器接收到响应
④如果是同域下的请求,浏览器不会额外做什么,这次前后端通信就圆满完成了
⑤如果是跨域请求,浏览器会从响应头中查找是否允许跨域访问
⑥如果允许跨域,通信圆满完成
⑦如果没找到或不包含想要跨域的域名,就丢弃响应结果
- CORS的兼容性
IE10及以上版本的浏览器可以正常使用CORS
(2)方案二:JSONP
- JSONP原理:
script标签跨域不会被浏览器阻止,而JSONP主要就是利用script 标签,加载跨域文件 - 使用JSONP跨域的过程:
①服务器端准备好JSONP接口
②手动加载JSONP接口或动态加载JSONP接口
4、其他
- 优先使用CORS解决跨域问题.
- 不能使用CORS的时候,可以考虑使用JSONP解决跨域问题