1.AJAX的原生语法:
原理：
AJAX是在不刷新页面的情况下去请求数据 然后把这个数据 局部刷新的页面上(DOM) 的技术
原生代码的大致步骤:
1.创建ajax对象:兼容性写法 xhr XMLHttpRequest 如果低版本的IE浏览器 就是ActivXObject()
2.配置网络连接 open 请求方式 目标网址 是否异步
3.配置其他选项:xhr 还有很多方法和属性 可以配置 有默认配置
4.发送请求 send
5.监听网络请求状态
6.判断如果网络状态为4 也就是后端返回数据包了 如果数据包中状态码为200说明数据正确
7.处理数据 操作页面
2.跨域
如果用户访问我们的A服务器的网页,网页内部的AJAX 去请求B服务器的数据接口
就算是B服务器把json数据发送给了用户的浏览器,但是浏览器因为同源策略的原因 会阻止数据使用
这种现象就是跨域了,具体的跨域的两个服务器的标识是: 协议 ip port
2.CORS的原理
在实际生产或者项目的开发阶段 有时候真的需要跨域访问资源
可以在后端发送数据包时 在数据包的头部配置 这个数据包被跨域请求时的 跨域资源共享 白名单
也就是 res.setHeader("Access-Contrl-Allow-Origin","具体的白名单域,可以配置*")
3.JSONP的原理
前端提前设置一个函数假设函数名为fn1,然后把fn1这个字符串用script标签的src属性发送给后端
后端解析出参数querystring中的fn1字符串 把后端的json数据 拼接成 'fn1(json数据)' 这个字符串发送给前端
前端因为是用的script请求的资源因此:不会有跨域限制,并且会把得到的资源用v8去运行 然后就会执行fn1这个函数
提前设定好的函数fn1就可以接受到网络请的数据 ，这种利用了script去跨域请求的设计就是JSONP
4.Proxy的原理
在开发阶段 最常用的手段,比如Vue,React,等前端框架中
常常有一个自己的开发服务器
如果用户访问我们的A服务器的网页,网页内部的AJAX 去请求A服务器的数据接口,是不会跨域的
然后A服务器去请求B服务器的数据,再把返回给A服务器的数据 返回的用户
A服务器就是一个代理服务器
