目录
跨域
“源”是什么
源:是由 协议、主机名、端口号组成的
协议:http、https、file等协议
主机名:服务器的IP地址,比如127.0.0.1、绑定到服务器的域名,比如www.xxx.com
端口号:0~65535 之间的一个数组,每个服务器使用的端口,不可以有冲突,http协议默认的端口号是80,https默认端口号是443
同源策略
1、同源,指的是两个源相同的协议、主机名、端口号相同
2、同源策略,是浏览器的一种保护机制,都要去遵守的一种策略
3、如果非同源,共有以下三种行为受到限制
1、DOM无法操作(A网页和B网页的url非同源,那么不能相互操作对方的DOM)
2、Cookie无法操作(A、B两个网站非同源,则无法操作对方的Cookie)
3、Ajax请求无效(打开页面的url和请求的接口非同源,则Ajax请求无效,也就是会报错,不能得到服务端的响应结果)
4、违反了同源策略的请求,就是跨域请求
解决跨域问题
1、解决跨域问题,就是再响应头里设置允许跨域的地址访问服务器
跨域方案之CORS
1、由于XHR对象被W3C标准化之后,提出了很多XHR Level2的新构想,其中新增CORS跨域资源共享。
2、浏览器升级后开始支持CORS方案,从IE10开始支持。
3、CORS方案,就是通过服务器设置一系列响应头来实现跨域。而客户端不需要做什么额外的事情。
4、CORS才是解决跨域的真正解决方案。它是标准。
5、实际开发中,可以使用 第三方模块 cors 来解决跨域问题
1、下载安装cors:npm install cors
2、加载cors:const cors = require('cors');
3、注册为中间件:app.use(cors());
跨域方案之JSONP
1、是程序员被迫想出来的解决跨域方案
2、JSONP方案和Ajax没有任何关系
3、JSONP方案只支持GET请求
4、JSON没有浏览器兼容问题,任何浏览器都支持
JSONP原理
1、HTML标签的src属性,不受跨域访问的影响
<img src="其他源的图片" />
<script src="其他源的JS代码"></script>
2、JSONP的实现
客户端先准备一个函数,比如 abc,并且设置好形参,准备接收响应数据
客户端通过script标签的src属性,向接口发送请求,并传递 callback=abc 参数
服务端响应一个字符串 abc({ "status": 0, "message": "登录成功" })
客户端将服务器返回的字符串当做JS代码解释,从而实现跨域
递归
递归的概念
在编程语言中,函数直接或者间接调用函数本身,则该函数称为递归函数
简单的来说,递归就是函数自己调用自己,因为是自己调用自己,所以容易出现死循环,所以使用递归的时候一般会注意两个控制条件
1、设置调用条件,满足条件,则函数调用自己
2、设置跳出条件,满足条件,则跳出函数的调用