SetRequestHeader 做了什么

当发送 HTTP 请求时，请求头部（header）中通常包含了一些关于请求本身的信息，例如请求的方法、请求的域名、请求的数据格式等。setRequestHeader() 是一个用来设置请求头部信息的方法，它可以帮助开发者设置不同的请求头部信息来影响 HTTP 请求的行为。

语法

XMLHttpRequest.setRequestHeader(header, value);

参数

• header 字符串类型。表示需要设置的请求头 key。
• value 字符串类型。表示需要设置的请求头 value。

作用

setRequestHeader() 方法可以用来设置请求头中的某些信息，例如 Accept、Accept-Language、Content-Type 等。这些信息会传递给服务器端作为 HTTP 请求的一部分。下面是一些常用的请求头：

Accept

设置可以接受的响应数据类型，它的值是字符串类型，例如：

xhr.setRequestHeader('Accept', 'text/html,application/json');

这样表示希望服务器返回 HTML 或 JSON 结果。

Authorization

设置认证信息，一些 API 要求客户端提供认证信息才能进行访问。例如：

xhr.setRequestHeader('Authorization', 'Bearer xxxxxxxx');

这里的 xxxxx 表示 JWT token。

Content-Type

表示发送请求的数据类型，例如：

xhr.setRequestHeader('Content-Type', 'application/json');

这样表示请求的数据是 JSON 格式数据。

注意事项

在使用 setRequestHeader() 时要注意以下几点：

• 浏览器限制。对于某些请求头是浏览器禁止设置的，例如 Accept-Encoding 和 Host 等。
• 顺序。注意设置请求头的顺序，因为一些请求头会相互影响。例如设置了 Content-Type，那么接下来设置的 Content-Encoding 就无效了。
• 安全性。请求头中携带敏感信息可能会被截获，要慎重使用。例如用户的 Cookie、Token 等。

示例代码

const xhr = new XMLHttpRequest();
xhr.open('POST', '/api/login');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('Accept', 'application/json');
xhr.send(JSON.stringify({ username: 'example', password: 'example' }));

xhr.onreadystatechange = () => {
  if (xhr.readyState === 4 && xhr.status === 200) {
    console.log(xhr.responseText);
  }
};

以上代码通过 setRequestHeader() 方法设置了请求头 Content-Type 和 Accept，请求的数据是 JSON 格式数据，返回结果也是 JSON 格式数据。