理解 Ajax 为何发出预检请求 (OPTIONS)：跨域请求背后的机制

2023-10-20 13:43:55

在计算机网络的世界中，Ajax（Asynchronous JavaScript and XML）和跨域请求扮演着重要的角色。Ajax 允许您在不重新加载整个网页的情况下与服务器交换数据，而跨域请求则允许您向不同域的服务器发送请求。然而，为了确保网络安全，浏览器会对跨域请求进行限制，其中预检请求便是其中关键的一环。

一、预检请求的缘由
预检请求的出现源于同源策略。同源策略是浏览器的一项安全机制，旨在防止恶意网站窃取其他网站的敏感数据。根据同源策略，只有来自相同源（协议、域名、端口）的请求才会被允许。当您进行跨域请求时，浏览器会首先发送一个预检请求来检查服务器是否允许该请求。

二、预检请求的类型
预检请求的类型取决于请求方法和请求头。简单请求仅使用基本 HTTP 方法（GET、POST、HEAD）且不包含自定义请求头，因此不需要预检请求。复杂请求则需要预检请求，因为它使用其他 HTTP 方法（如 PUT、DELETE、OPTIONS）或包含自定义请求头。

三、预检请求的流程
当浏览器发出跨域请求时，会首先发送一个预检请求。预检请求使用 OPTIONS 方法，并且请求头中包含 Origin、Access-Control-Request-Method 和 Access-Control-Request-Headers 字段。这些字段分别表示请求的来源、请求的方法和请求的自定义请求头。

服务器收到预检请求后，会根据预检请求中的信息判断是否允许该请求。如果服务器允许该请求，它会返回 200（OK）状态码和相应的 Access-Control-Allow-* 响应头。这些响应头表明服务器允许该请求。如果服务器不允许该请求，它会返回其他状态码（如 403（Forbidden））和相应的 Access-Control-Allow-* 响应头。这些响应头表明服务器禁止该请求。

在服务器返回预检请求的响应后，浏览器会检查响应头中的信息。如果服务器允许该请求，浏览器会继续发送实际的数据请求。如果服务器禁止该请求，浏览器会阻止实际的数据请求。

四、预检请求的优化
为了优化跨域请求的性能，您可以采取以下措施：