2020-10-07

XHR是什么？[前端]

我们可能平时经常用Chrome开发者工具的XHR来查看请求/返回，包括我们调试Vue的http请求，究竟什么是XHR？

1999年，微软公司发布IE5，第一次引入新功能：允许javascript脚本向服务器发起HTTP请求。这个功能当时并没有引起注意，直到2004年Gmail发布和2005年Google Map发布，才引起广泛重视。2005年2月，ajax这个词第一次正式提出，指围绕这个功能进行开发的一整套做法。从此，ajax成为脚本发起HTTP通信的代名词，W3C也在2006年发布了它的国际标准。

AJAX 是 Asynchronous JavaScript And XML（异步的javascript和XML）的缩写。AJAX允许只更新一个 HTML 页面的部分 DOM，而无须重新加载整个页面。AJAX还允许异步工作，这意味着当网页的一部分正试图重新加载时，您的代码可以继续运行（相比之下，同步会阻止代码继续运行，直到这部分的网页完成重新加载）。

AJAX包括以下几步骤：1、创建AJAX对象；2、发出HTTP请求；3、接收服务器传回的数据；4、更新网页数据
一句话概括就是，AJAX通过原生的XMLHttpRequest对象发出HTTP请求，得到服务器返回的数据后，再进行处理。

AJAX技术的核心是XMLHttpRequest对象(简称XHR)，这是由微软首先引入的一个特性，其他浏览器提供商后来都提供了相同的实现。XHR为向服务器发送请求和解析服务器响应提供了流畅的接口，能够以异步方式从服务器取得更多信息，意味着用户单击后，可以不必刷新页面也能取得新数据。

IE5是第一款引入XHR对象的浏览器。在IE5中，XHR对象是通过MSXML库中的一个ActiveX对象实现的，而IE7+及其他标准浏览器都支持原生的XHR对象。

XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问，包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步地返回 Web 服务器的响应，并且能够以文本或者一个 DOM 文档的形式返回内容。XHR接口强制要求每个请求都具备严格的HTTP语义–应用提供数据和URL，浏览器格式化请求并管理每个连接的完整生命周期

XHR仅仅允许应用自定义一些HTTP Headers，但更多的 Headers 是不能自己设定的：

1
2
3

Accept-Charset, Accept-Encoding, Access-Control-*
Host, Upgrade, Connection, Referer, Origin
Cookie, Sec-, Proxy-, 等等

参考资料：https://developer.mozilla.org/zh-CN/docs/Web/Guide/AJAX/Getting_Started