Ajax

1、Ajax:它是浏览器提供的一套方法，可以实现页面无刷新更新数据，提高用户浏览网站应用的体验。
2、Ajax的应用场景：（1、页面上拉加载更多数据 （2、列表数据无刷新分页（3、表单项离开焦点数据验证（4、搜索框提示文字下拉列表。
3、Ajax的运行环境：Ajax技术需要运行在网站环境中才能生效，可以借助Node开启网站服务器，并且实现静态资源访问的功能，将代码写在HTML文件中，然后将HTML文件放在静态资源文件夹中，这样就可以通过域名的方式访问html页面了。
4、Ajax就是浏览器的代理人，由Ajax帮助浏览器向服务器发送请求，由Ajax帮助浏览器接收服务器端的响应数据，当Ajax接收到服务器端响应过来的数据之后，再使用DOM方法将从服务器端接收过来的数据添加到页面中。这样我们就可以实现用户边浏览网站内容，边向服务器端请求数据了并且实现页面无刷新技术。
5、Ajax的实现步骤：
（1、创建Ajax对象
（2、告诉Ajax请求地址以及请求方式
（3、发送请求
（4、获取服务器端与客户端的响应数据
【记得在这些之前一定要先开启网站服务器】
6、服务器端响应数据的格式：
在真实的项目中，服务器端大多数情况下会以JSON对象作为响应数据的格式。当客户端拿到响应数据时，要将JSON数据和HTML字符串进行拼接，然后将拼接的结果展示在页面中。
在http请求与响应的过程中，无论是请求参数还是响应内容，如果是对象类型，最终都会被转换为对象字符窜进行传输。
JSON.parse() 将jason字符串转化为Jason对象。
在客户端要将JASON数据和html进行拼接 ，然后将拼接的结果展示在页面中。
7、请求参数传递
GET请求方式：
xhr.open(‘get’)
POST请求方式：
xhr.setRequestHeader
xhr.send()
8、请求参数的格式“
首先需在请求头中指定Content-Type属性的值是application/json，告诉服务器当前请求参数的格式是json.还需要将json对象参数转换为json字符窜，然后再放置到send方法中，因为在传递请求参数的时候，参数必须以字符窜的方式进行传递，这是规定。JSON.stringify()将json对象转换为json字符串。
9、注意：get请求是不能提交JSON对象数据格式的，传统网站的表单提交也是不支持json对象数据格式的，。
10、Ajax错误处理：
（1、网络通畅，服务器端能接收到请求，服务器端返回的结果不是预期结果。【可以判断服务器端返回的状态码，分别进行处理，xhr.status获取HTTP状态码】
（2、网络通畅，服务器端没有接收到请求，返回404状态码。【检查请求地址是否错误】
（3、网络通畅，服务器端能接收到请求，服务器端返回500状态码。【服务器端错误，找后端程序员进行沟通】
（4、网络中断，请求无法发送到服务器端
【会触发xhr对象下面的onerror事件，在onerro事件处理函数中进行处理。
11、Ajax状态码：表示Ajax请求过程的状态，是Ajax对象返回的。
HTTP状态码：表示请求的处理结果，是服务器端返回的。
12、低版本IE浏览器的缓存问题
13、无论是客户端模板引擎还是服务端模板引擎，它的作用就是将数据拼接起来。

14、FormData对象的作用：
（1、模拟HTML表单，相当于将HTML表单映射成表单对象，自动将表单对象中的数据拼接成请求参数的格式。
（2、异步上传2进制文件

15、formData对象的实例方法：
（1、获取表单对象中属性的值 formData.get(‘key’)
（2、设置表单对象中属性的值 formData.set(‘key’)
（3、删除表单对象中属性的值 formData.delete(‘key’)
（4、向表单对象属性中追价值 formData.append(‘key’,‘value’)
set方法与append方法的区别是，在属性名已经存在的情况下，set会覆盖原来的值，而append会保留2个值。

16、FormData二进制文件上传、（二进制文件指图片、视频、音频）

17、同源即 同协议，端口，域名。

18、同源政策的目的：保证用户信息的安全，防止恶意的网站窃取数据，最初的同源政策是指A网站在客户端设置的cookie，B网站时不能访问的。
19、随着互联网的发展，同源政策也越来越严格，在不同源的情况下，其中有一项规定就是无法向非同源地址发送Ajax请求，如果请求，浏览器就会报错。

20、同源政策：
（1、使用JSONP解决同源限制的问题。（它不属于Ajax请求，但它可模拟ajax请求）
(2、CORS跨域资源共享
它允许浏览器向跨域服务器发送Ajax请求，克服了Ajax只能同源使用的限制。
（3、访问非同源数据，服务器端解决方案（同源政策是浏览器端给予Ajax技术的限制，服务器端不存在同源政策限制）

21、JSONP代码优化
（1、客户端需要将函数名称传递给服务器端
（客户端将函数名称通过请求参数发送到服务器端，服务端只要接收到的函数名字再返回给调用者即可）
（2、将script请求的发送变成动态请求。
（3、封装jsonp函数，方便请求发送
22、withCredentials
在使用Ajax技术发送跨域请求时，默认情况下不会在请求中携带cookie信息。
withCredentials：指在涉及跨域请求时，是否携带Cookie信息，默认是false。
Access-Control-Allow-Credentials：true允许客户端发送请求时，携带cookie信息。
23、serialize;
将表单中的数据自动拼接成字符串的类型