简单请求

简单请求（Simple Request）是指满足一定条件的跨域 HTTP 请求。对于这些请求，浏览器会直接发送请求，而不会先发送预检请求（Preflight Request）。简单请求的条件较为严格，以确保请求的安全性和兼容性。

简单请求的条件

要被认为是简单请求，必须满足以下条件：

1. 请求方法：只能是以下三种之一：

   • GET
   • POST
   • HEAD

2. 请求头部：只能使用以下几种标准头部，且不能包含自定义头部：

   • Accept
   • Accept-Language
   • Content-Language
   • Content-Type（值仅限于 application/x-www-form-urlencoded、multipart/form-data、text/plain）

3. Content-Type 限制：如果使用 Content-Type 头部，其值必须是以下三者之一：

   • application/x-www-form-urlencoded
   • multipart/form-data
   • text/plain

如果请求满足以上所有条件，浏览器会将其视为简单请求，直接发送请求，并根据服务器的响应头决定是否允许访问响应数据。

简单请求的示例

假设有一个网页 https://example.com，需要从 API 服务 https://api.example.com/data 获取数据。由于这个请求满足简单请求的条件，浏览器会直接发送请求。

示例 1：GET 请求

请求：

GET /data HTTP/1.1
Host: api.example.com
Origin: https://example.com

响应：

HTTP/1.1 200 OK
Access-Control-Allow-Origin: https://example.com
Content-Type: application/json

{ "data": "Sample data" }

在这个示例中，浏览器发送一个 GET 请求到 https://api.example.com/data。服务器响应中包含 Access-Control-Allow-Origin: https://example.com，表示允许 https://example.com 访问资源。浏览器根据这个头部决定是否允许 JavaScript 访问响应数据。

示例 2：POST 请求

请求：

POST /submit HTTP/1.1
Host: api.example.com
Origin: https://example.com
Content-Type: application/x-www-form-urlencoded

name=JohnDoe&age=30

响应：

HTTP/1.1 200 OK
Access-Control-Allow-Origin: https://example.com
Content-Type: application/json

{ "status": "Success" }

在这个示例中，浏览器发送一个 POST 请求到 https://api.example.com/submit，使用 application/x-www-form-urlencoded 的内容类型。服务器响应中包含 Access-Control-Allow-Origin: https://example.com，表示允许 https://example.com 访问资源。

配置 CORS 以支持简单请求

为了支持简单请求，服务器需要在响应中包含适当的 CORS 头部。下面是一个使用 Express.js 配置 CORS 的示例：

const express = require('express');
const app = express();

app.use((req, res, next) => {
    res.header('Access-Control-Allow-Origin', 'https://example.com');
    next();
});

app.get('/data', (req, res) => {
    res.json({ data: 'Sample data' });
});

app.post('/submit', (req, res) => {
    res.json({ status: 'Success' });
});

app.listen(3000, () => {
    console.log('Server running on port 3000');
});

在这个示例中，服务器为所有请求设置 Access-Control-Allow-Origin 头部，允许来自 https://example.com 的请求。

总结

简单请求是一类特殊的跨域请求，浏览器会直接发送而不进行预检。这类请求必须满足严格的条件，包括请求方法、请求头部和 Content-Type 的限制。通过正确配置服务器的 CORS 头部，可以确保这些简单请求的安全性，并允许合法的跨域访问。理解和正确配置简单请求，对于确保 Web 应用的安全性和兼容性至关重要。