HTTP 标头 | 访问控制请求标头

HTTP 标头指的是 HTTP 请求和响应中的元数据，它们允许客户端和服务器交换附加信息，从而使 HTTP 更加灵活和可扩展。其中一类重要的 HTTP 标头是访问控制请求标头。这些标头允许浏览器告知服务器允许使用哪些内容，并提供了控制跨域请求的机制。

常用的访问控制请求标头

Origin

Origin 表明一个 URI 的来源。它由一个协议、主机名和端口号组成。浏览器一般会在发送跨域请求时发送 Origin 标头，它包含了当前页面的源，服务器可以根据该标头来决定是否允许该请求。

Access-Control-Request-Method

Access-Control-Request-Method 标头用于表明实际请求使用的 HTTP 方法。在发送跨域请求时，浏览器会先发送一个预检请求（OPTIONS 请求），该请求会包含该标头，以及 Origin 和 Access-Control-Request-Headers 标头。

Access-Control-Request-Headers

Access-Control-Request-Headers 标头表明实际请求会使用哪些非简单标头。如果实际请求需要使用自定义标头，那么浏览器必须先发送一个预检请求以获取服务器对该标头的支持情况。

使用方式

以下是一个使用访问控制请求标头的示例：

const xhr = new XMLHttpRequest();
xhr.open('POST', 'https://api.example.com/create');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.setRequestHeader('Origin', 'https://example.com');
xhr.setRequestHeader('Access-Control-Request-Method', 'POST');
xhr.setRequestHeader('Access-Control-Request-Headers', 'Content-Type');

xhr.onreadystatechange = function() {
  if (xhr.readyState === XMLHttpRequest.DONE) {
    if (xhr.status === 200) {
      console.log(xhr.responseText);
    } else {
      console.log('There was a problem with the request.');
    }
  }
};

xhr.send(JSON.stringify({ name: 'John Doe' }));

在这个示例中，我们使用了 XMLHttpRequest 发送了一个跨域请求。在设置请求头时，我们设置了 Origin、Access-Control-Request-Method 和 Access-Control-Request-Headers 三个访问控制请求标头，以指明实际请求的一些信息。在服务器端，如果发现这些标头合法，就会向客户端发送一个 Access-Control-Allow-Origin 标头（允许跨域访问的域名），以及一些其它相关的响应头。