解释 HTTP 中的内容协商，如何根据客户端偏好返回合适的内容？

一、内容协商的本质与价值

内容协商（Content Negotiation）是HTTP协议中客户端与服务器就资源表现形式达成一致的协商机制。其核心价值在于：用同一URI提供资源的不同表现形式，同时保证客户端获得最适合自身环境的内容版本。

典型应用场景：

多语言站点自动适配浏览器语言
根据设备类型返回移动版/桌面版页面
API接口支持JSON/XML等多种数据格式
图片资源按客户端支持格式自动转换

二、核心协商机制解析

1. 请求头驱动机制

客户端通过以下请求头声明偏好：

Accept: 可接受的媒体类型（如text/html）
Accept-Language: 自然语言偏好（如zh-CN）
Accept-Encoding: 内容编码偏好（如gzip）
Accept-Charset: 字符集偏好（如UTF-8）

2. 服务端决策流程

服务端接收到请求后，按以下优先级处理：

检查Accept头中的媒体类型
解析Accept-Language语言偏好
应用Accept-Encoding压缩方式
最终确定响应内容格式

三、实战代码示例

1. Express服务端多格式支持

// 中间件：内容协商处理器
function contentNegotiation(req, res, next) {// 检测客户端接受的媒体类型const accepts = req.accepts(['json', 'html', 'xml']);// 设置默认响应格式res.format({'text/html': () => {res.render('user-profile', { user: req.user });},'application/json': () => {res.json({ data: req.user });},'application/xml': () => {const xml = `<user><id>${req.user.id}</id></user>`;res.type('xml').send(xml);},default: () => {// 不支持的格式返回406res.status(406).send('Not Acceptable');}});next();
}// 路由应用中间件
app.get('/profile', contentNegotiation);

2. 前端请求示例

// 明确请求JSON格式
fetch('/api/data', {headers: {'Accept': 'application/json'}
});// 支持多种格式的灵活请求
fetch('/api/data', {headers: {'Accept': 'application/json, text/xml;q=0.9'}
});

3. Nginx多语言配置示例

server {# 启用内容协商index index.html;# 定义可用语言root /var/www;types {text/html html;}# 语言优先级处理split_clients "$http_accept_language" $lang {40% en;30% fr;20% de;10% zh-CN;}location / {try_files $uri/$lang/index.html =404;}
}

四、工程实践建议

1. 缓存控制策略

必须配合Vary头确保缓存有效性：

// Express设置Vary头示例
app.get('/data', (req, res) => {res.vary('Accept-Encoding, Accept-Language');// ...响应处理
});

2. 多语言实现要点

// 中间件：语言协商
app.use((req, res, next) => {const langs = req.acceptsLanguages('en', 'zh', 'ja');req.preferredLang = langs || 'en';next();
});// 路由处理器
app.get('/page', (req, res) => {const template = `${req.preferredLang}/page.html`;res.render(template);
});

3. 版本控制最佳实践

GET /api/v2/users HTTP/1.1
Accept: application/vnd.myapi.v2+json

// 版本协商中间件
app.use('/api', (req, res, next) => {const version = req.get('Accept').match(/vnd\.myapi\.v(\d+)/)?.[1] || 1;req.apiVersion = parseInt(version);next();
});

五、注意事项与调试技巧

1. 质量参数(q)处理

客户端请求示例：

http

Accept: text/html;q=0.8, application/json;q=0.9

服务端处理逻辑：

javascript

function parseAccept(header) {return header.split(',').map(type => {const [mime, q = '1'] = type.split(';q=');return { mime: mime.trim(), q: parseFloat(q) };}).sort((a, b) => b.q - a.q);
}

2. 调试工具使用

Chrome开发者工具示例：