How do I send a cross-domain POST request via JavaScript?
要在 JavaScript 中发送跨域 POST 请求，通常有几种方法可以处理，其中包括使用 XMLHttpRequest 对象、fetch API 或者通过设置 CORS 头来解决浏览器的同源策略限制。下面我将具体介绍每种方法的使用：1. 使用 XMLHttpRequest 发送跨域 POST 请求尽管 XMLHttpRequest 是较老的技术，但它仍然可以用来发送跨域请求。为了使跨域请求工作，服务器必须在响应中包含一些 CORS（Cross-Origin Resource Sharing）头。var xhr = new XMLHttpRequest();xhr.open("POST", "https://api.example.com/data", true); // 第三个参数 true 表示异步xhr.setRequestHeader("Content-Type", "application/json;charset=UTF-8");xhr.onreadystatechange = function() { if (xhr.readyState === 4 && xhr.status === 200) { console.log(xhr.responseText); }};xhr.send(JSON.stringify({key: "value"}));2. 使用 fetch API 发送跨域 POST 请求fetch API 是现代浏览器中的新标准，用于进行网络请求。它同样支持跨域请求，并且语法更加现代和简洁。fetch('https://api.example.com/data', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({key: 'value'})}).then(response => response.json()).then(data => console.log(data)).catch(error => console.error('Error:', error));3. 设置 CORS 头在实际的服务器端配置中，为了使跨域请求成功，通常需要在服务器端设置相应的 CORS 头。例如，在 Node.js 中可以使用 Express 框架和 cors 中间件来简化这一过程：const express = require('express');const cors = require('cors');const app = express();app.use(cors({ origin: 'https://your-webpage.com' // 只允许来自特定来源的跨域请求}));app.post('/data', (req, res) => { // ... res.json({ success: true });});示例假设我们有一个任务是从前端 JavaScript 应用向 https://api.example.com/data 发送 POST 请求，并且这个 API 支持跨域请求。我们可以使用 fetch API 这样做：async function postData(url = '', data = {}) { const response = await fetch(url, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(data) }); return response.json(); // 解析并返回 JSON 数据}postData('https://api.example.com/data', { key: 'value' }) .then(data => console.log(data)) .catch(error => console.error(error));在本例中，postData 函数通过 fetch 发送 POST 请求，并等待解析成 JSON 的响应。如果服务器正确配置了 CORS 头以允许来自当前源的请求，那么此请求将成功完成。
