AJAX

异步的 JS 和 XML，是一种用于网页进行异步交换数据的技术，它可以在不刷新整个页面的情况下向服务器异步发起请求获取数据，从而实现动态更新页面（异步更新页面）。它减少了响应实现和带宽的消耗，提高了用户的交互体验。但是它不利于 SEO。（因为 SEO 在进行爬虫抓取的时候没有办法去抓取 AJAX 里的内容以及发送的 url），如果要做 SEO 可以使用服务端渲染技术（SSR）

没有 AJAX 时需要手动刷新页面。

SEO

搜索引擎优化。

AJAX 实现

• 创建一个 XMLHttpRequest 的实例对象；
• 使用 open 方法定义请求的方式、url 地址、是否异步（默认异步）；
• 如果是 post 请求需要设置请求头 setRequestHeader；
• 如果需要向后端传递信息，可以使用 send 方法传递；

  get 请求一般不用 xhr.send(null)，有也是作为 query 在 url 地址中传递；

• 通过在 onreadystatechange 函数中监听 readyState 的值，来接收后端返回的数据，这个函数在整个 AJAX 初始到连接到结束都会执行；

  0: 未初始化 —— XMLHttpRequest 对象已经创建，但还没有调用 open 方法；
  1：已开启 —— open 方法被调用，send 方法没被调用；
  2：已发送 —— send 方法已调用，请求已经发给服务器了；
  3：正在接收 —— 服务器正在处理请求并返回数据；
  4：完成 —— 服务器已经完成了数据传输；
  status 200： 服务器返回状态码。

• 或者直接使用 addEventListener 去监听 load 事件，该事件只会在 readyState=4 的时候执行。
• 也可以使用 addEventListener 去监听一个 progress，来获取一个进度；
• 也可以设置超时时间 timeout，然后使用 addEventListener 去监听一个 timeout；
• 也可也中断请求；

HTTP 状态码

• 1xx：信息性状态码。比如 102 服务器已经收到并正在处理该请求；
• 2xx：请求成功响应。
• 3xx：重定向消息。304 服务端告诉客户端数据没有变换，可以使用缓存。
• 4xx：客户端响应错误。400 参数错误，401 可能是 token 掉了，403 没有权限。
• 5xx：服务端错误。

JSON

JSON 是一种数据格式，常用于前后端数据传输。它体积小，传输快，易于用户阅读和编写，也可也被各种编程语言轻松解析。