AJAX 的特点

AJAX 的优点

1. 可以无需刷新页面而与服务器端进行通信
2. 允许你根据用户事件来更新部分页面内容

AJAX 的缺点

1. 没有浏览历史，不能回退
2. 存在跨域问题(同源)
3. SEO 不友好

AJAX 请求过程

1.创建XMLHttpRequest异步对象

var xhr = new XMLHttpRequest();

2.使用open方法与服务器建立连接

xhr.open(请求类型, URL, 是否异步)

使用post 方式发送数据需要设置请求头 （为保证请求头被发送，需要在open()和send()之前调用setRequestHeader()）

xhr.setRequestHeader(头部字段名称, 头部字段值)

3.使用send()向服务器发送请求

xhr.send(请求体)

4.注册事件（给 ajax 设置事件）

xhr.onreadystatechange = callback；

5.获取响应并更新页面

function callback() {  
    // 判断异步对象的状态  
    if(xhr.readyState == 4) {    
        // 判断交互是否成功    
        if(xhr.status == 200) {      
            // 获取服务器响应的数据      
            var res = xhr.responseText      
            // 解析数据      
            res = JSON.parse(res) //反序列化  
        }  
    } 
}

ajax跨越解决

什么是同源策略

同源策略是浏览器的一个【安全策略】，同源就是协议、域名、端口都相同，不同源的数据禁止访问。

什么是跨越

协议 域名 端口 有一个不同就产生跨越

ajax跨越解决

jsonp

只能解决get跨域

原理：所有的src属性和href属性都不受同源策略限制。所有可以动态创建一个script标签，利用script标签的src属性不受同源策略限制，进行第三方服务器数据内容请求。

CORS：跨域资源共享

原理：后端服务器设置Access-Control-Allow-OriginHTTP响应头之后，浏览器将会允许跨域请求

......

常见的状态码

• 200 请求正常。
• 204 请求处理成功，但没有资源返回。
• 301 永久重定向。
• 302 临时重定向。
• 304 表示客户端发送附带条件的请求时服务器端允许请求访问资源，但因发生请求未满足条件的情况
• 400 请求报文中存在语法错误。
• 401 未授权，需要用户验证
• 403 访问被服务器拒绝
• 500 服务器错误
• 503 服务器无法处理请求。