CORS 预检请求教程

CORS（跨源资源共享）是现代Web开发中常见的概念。当你需要从不同的域名请求资源时，浏览器会默认阻止这种请求，这就是我们所说的“同源策略”。CORS允许你绕过这个限制。

以下是一些关于CORS预检请求的常见问题及解答：

常见问题

• 什么是CORS预检请求？ CORS预检请求（Preflight request）是浏览器在正式发起跨源请求前，发送的一种特殊的HTTP请求。它的目的是检查服务器是否允许实际的请求。

• CORS预检请求包含哪些信息？ CORS预检请求通常包含以下信息：

  • 请求方法（GET、POST等）
  • 请求头（如Content-Type、X-Requested-With等）
  • 请求体（如果有）

• 如何处理CORS预检请求？ 服务器需要设置特定的HTTP响应头，以允许跨源请求。以下是一些常见的响应头：

  Access-Control-Allow-Origin: *
  Access-Control-Allow-Methods: GET, POST, PUT, DELETE
  Access-Control-Allow-Headers: Content-Type, X-Requested-With
  

例子

假设你有一个网站 http://example.com，你想要从另一个域名 http://api.example.com 请求资源。

请求示例：

fetch('http://api.example.com/data', {
  method: 'GET',
  headers: {
    'Content-Type': 'application/json'
  }
});

CORS预检请求示例：

fetch('http://api.example.com/data', {
  method: 'OPTIONS',
  headers: {
    'Content-Type': 'application/json',
    'Access-Control-Request-Method': 'GET',
    'Access-Control-Request-Headers': 'Content-Type, X-Requested-With'
  }
});

如果服务器返回了允许跨源的响应头，那么实际的请求就可以正常发送。

学习更多

如果你对CORS有更深入的了解需求，可以访问我们网站上的 CORS 完全指南。