目录
一、AJAX简介
AJAX全称为AsynchronousJavaScriptAndXML，就是异步的JS和XML。通过AIAX可以在浏览器中向服务器发送异步请求，最大的优势：无刷新获取数据。AAX不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式。
二、XML简介
2.1.XML可扩展标记语言
2.2.XML被设计用来传输和存储数据。
2.3.XML和HTML类似，不同的是HTML中都是预定义标签，而XML中没有预定义标签，全都是自定义标签，用来表示一些数据。
2.4.现已被JSON替代
三、AJAX的特点
3.1.AJAX的优点
1).可以无需刷新页面而与服务器端进行通信
2).允许你根据用户事件来更新部分页面内容。
3.2.AJAX的缺点
1).没有浏览历史，不能回退
2).存在跨域问题 (同源)
3).SEO不友好
四、AJAX的使用
4.1.核心对象
XMLHttpRequest，AJAX的所有操作都是通过该对象进行的。
4.2.使用步骤
1).创建XMLHttpRequest对象
var xhr=newXMLHttpRequest()
2).设置请求信息
2.1).xhr.open(method, url);
2.2).//可以设置请求头，一般不设置
2.3).xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
3).发送请求
xhr.send(body）//get请求不传body参数，只有post请求使用
4).接收响应
4.1).//xhr.responseXML接收xml格式的响应数据
4.2).//xhr.responseText接收文本格式的响应数据
4.3).xhr.onreadystatechange=function()
4.4).if(xhr.readyState == 4 && xhr.status == 200)
4.5).vartext=xhr.responseText;
4.6).console.log(text);}}
4.3.解决IE缓存问题
1).问题：在一些浏览器中(IE),由于缓存机制的存在，ajax只会发送的第一次请求，剩余多次请求不会在发送给浏览器而是直接加载缓存中的数据。
2).解决方式：浏览器的缓存是根据url地址来记录的，所以我们只需要修改url地址即可避免缓存问题
3).xhr.open("get",”/testAJAx?t="+Date.now());
4.4.AJAX请求状态
1).xhr.readyState可以用来查看请求当前的状态
2).https://developer.mozilla.org/zh-CN/docs/Web/APl/XMLHttpRequest/readyState
2.1).0：表示xMLHttpRequest实例已经生成，但是open()方法还没有被调用。
2.2).表示send()方法还没有被调用，仍然可以使用setRequestHeader()，设定HTTP请求的头信息。
2.3).2：表示send()方法已经执行，并且头信息和状态码已经收到。
2.4).3:表示正在接收服务器传来的body部分的数据。
2.5).4:表示服务器数据已经完全接收，或者本次接收已经失败了
五、jQuery 中的 AJAX
5.1.get 请求
$.get(url,[data], [callback], [type])
1).url:请求的URL地址。
2).data:请求携带的参数。
3).callback:载入成功时回调函数。
4).type:设置返回内容格式，xml,html，script,json,text，_default。post 请求
5.2.post 请求
$.post(url, [data], [callback], [type])
1).url:请求的URL地址。
2).data:请求携带的参数。
3).callback:载入成功时回调函数。
4).type:设置返回内容格式，xml,html,script,json,text,_default。
六、同源策略
6.1.同源策略(Same-OriginPolicy)最早由Netscape公司提出，是浏览器的一种安全策略。
1).同源策略(Same-OriginPolicy)最早由Netscape公司提出，是浏览器的一种安全策略。
2).违背同源策略就是跨域。
七、解决跨域
7.1.JSONP
1).JSONP是什么
JSONP（ISONwithPadding），是一个非官方的跨域解决方案，纯梓凭借程序员的聪明才智开发出来，只支持get请求。
2).JSONP怎么工作的？
2.1).在网页有一些标签天生具有跨域能力，比如：imglinkiframe Script。
2.2).JSONP就是利用script标签的跨域能力来发送请求的。
3).JSONP的使用
3.1).动态的创建一个script标签var script = document.createElement("script");
3.2).设置script的src，设置回调函数0= script.src ="http://localhost:3000/testAJAX?callback=abc";
7.2.CORS
1).CORS是什么？
CORS（CrosS-OriginResource Sharing），跨域资源共享。CORS是官方的跨域解决方案，它的特点是不需要在客户端做任何特殊的操作，完全在服务器中进行处理，支持get和post请求。跨域资源共享标准新增了一组HTTP首部字段，允许服务器声明哪些源站通过浏览器有权限访问哪些资源
2).CORS怎么工作的？
CORS是通过设置一个咱应头来告诉浏览器，该请求允许跨域，浏览器收到该响应以后就会对响应放行。
3).CORS的使用
3.1).router.get("/testAJAx"， function (req，res){
3.2).//通过res来设置响应头，来允许跨域请求
3.3)./res.set("Access-Control-Allow-Origin","http://127.0.0.1:3000");
3.4).res.set("Access-Control-Allow-Origin","*");
3.5).res.send("testAJAx返回的响应");；
3.6).);
674
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
