JavaScript中Ajax发送自定义请求头和Content-Type需确保：XMLHttpRequest在open后、send前用setRequestHeader设置，fetch通过headers对象配置；Content-Type必须与实际数据格式严格匹配，表单数据禁用手动设ContentType；跨域时自定义头会触发预检，需服务端配置Access-Control-Allow-Headers。
在 JavaScript 中使用 Ajax 发送自定义请求头（如 Authorization、X-Request-ID）和指定 Content-Type，核心在于正确配置 XMLHttpRequest 或 fetch 的请求选项。关键点是：请求头必须在 open() 之后、send() 之前设置；而 Content-Type 的设置需与实际发送的数据格式一致，否则后端可能解析失败。
用 XMLHttpRequest 设置自定义请求头
XMLHttpRequest 需手动调用 setRequestHeader() 方法添加请求头，且必须在 open() 之后、send() 之前执行：
- 调用
xhr.open('POST', '/api/data')初始化请求 - 紧接着用
xhr.setRequestHeader('Content-Type', 'application/json')设置类型 - 再添加其他自定义头，如
xhr.setRequestHeader('Authorization', 'Bearer abc123') - 最后调用
xhr.send(JSON.stringify(data))发送数据
注意：若发送的是表单数据（FormData），不要手动设置 Content-Type —— 浏览器会自动设置为带 boundary 的 multipart/form-data，手动设置反而会导致错误。
用 fetch 设置请求头与 Content-Type
fetch 通过 headers 选项统一管理请求头，更简洁直观：
立即学习“Java免费学习笔记（深入）”；
- 将
headers写成对象，键名不区分大小写，但推荐用标准驼峰或全小写（如'content-type'） - 发送 JSON 时，设
'Content-Type': 'application/json'，并确保body是字符串（用JSON.stringify()） - 发送表单数据时，直接传
new FormData(formElement)，不要设Content-Type—— 让浏览器自动处理 - 携带认证头示例：
'Authorization': 'Basic ' + btoa('user:pass')或'Bearer token123'
跨域场景下的注意事项
当请求跨域时，自定义请求头（如 X-Custom-Header）会触发预检（preflight）请求（OPTIONS）：
- 服务端必须响应
Access-Control-Allow-Headers，明确列出允许的头（如X-Request-ID） - 若设置了
Content-Type为application/json、text/xml等非简单类型，也会触发预检 - 简单
Content-Type（如text/plain、multipart/form-data、application/x-www-form-urlencoded）不会触发预检
常见错误是前端加了头但后端没配 CORS 响应头，导致请求被浏览器拦截。
Content-Type 与数据格式必须匹配
错配 Content-Type 是高频问题，直接影响后端能否正确解析：
- 发 JSON 字符串 →
Content-Type: application/json - 发 URL 编码表单 →
Content-Type: application/x-www-form-urlencoded（可用URLSearchParams构造 body） - 发二进制或文件 →
Content-Type通常不手动设（尤其用FormData时） - 发纯文本 →
Content-Type: text/plain; charset=utf-8
例如，用 fetch 发送表单数据却写了 'Content-Type': 'application/json'，后端收到的可能是无法解析的原始二进制流。
