fetch 跨域请求

fetch API 是 JavaScript 中用于发起网络请求的一个现代接口，支持浏览器和 Node.js 环境。对于跨域请求（CORS, Cross-Origin Resource Sharing），fetch 在默认情况下受到同源策略的限制，即只有当请求的域名、协议和端口与当前页面完全一致时，才会被浏览器允许。

如果需要向其他域发送请求，fetch 可能会遇到跨域问题。但是可以通过以下几种方法解决：

1. **设置 `credentials`**：可以在选项中设置 `fetch` 请求的 `credentials` 属性为 'include' 或者 'same-origin'。这允许发送 cookies，但只在 `HTTP/HTTPS` 协议下有效，并且可能会触发 CORS 头部。

   const options = {
     credentials: 'include',
   };
   fetch(url, options);

2. **服务端配置**：后端服务器可以添加 Access-Control-Allow-Origin、Access-Control-Allow-Methods 和 Access-Control-Allow-Headers 等 CORS 头部信息，允许指定的来源访问资源。

3. **JSONP**（JSON with Padding）：对于 GET 请求，如果目标域支持 JSONP，可以通过动态创建 `<script>` 标签的方式绕过同源策略。

4. **CORS Preflight Request**：fetch 首次跨域请求前，会先发送一个 OPTIONS 请求（CORS Preflight）检查权限。如果允许，客户端再发送实际的请求。

fetch(url, {
  method: 'POST', // 假设是 POST 方法
  headers: {
    'Content-Type': 'application/json',
  },
})
.then(response => response.json())
.catch(error => console.error('Error:', error));