原生JS Ajax 跨域的方法有：CORS、JSONP、代理服务器。在这三种方法中，CORS（跨域资源共享）是现代浏览器普遍支持的标准方法，它通过服务器设置允许跨域请求。本文将详细介绍这三种方法及其实现方式。
一、CORS（跨域资源共享）
CORS 是跨域请求最常用的方式，浏览器和服务器通过 HTTP 头信息来通信，允许来自不同源的请求。CORS 通过在服务器端设置 Access-Control-Allow-Origin 头来实现。
1.1 CORS 的基本概念
CORS 允许浏览器向服务器发送跨域请求，从而解决了同源策略（same-origin policy）的限制。同源策略是浏览器的安全机制，限制了不同源的脚本访问当前页面的资源。CORS 通过增加 HTTP 头信息，让服务器明确允许哪些源可以访问资源。
1.2 CORS 的实现步骤
服务器设置：在响应头中添加 Access-Control-Allow-Origin。
浏览器处理：浏览器会自动处理 CORS 请求，并根据服务器返回的头信息决定是否允许访问。
1.3 服务器端配置实例
在服务器端，可以通过设置响应头来允许跨域访问。例如，在 Node.js 中：
const http = require('http');
http.createServer((req, res) => {
res.setHeader('Access-Control-Allow-Origin', '*');
res.writeHead(200, {'Content-Type': 'text/plain'});
res.end('Hello Worldn');
}).listen(8080);
在这个例子中，* 表示允许所有源访问资源。你也可以指定具体的域名来限制访问。
1.4 客户端使用原生JS发送Ajax请求
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/api/data', true);
xhr.onload = function() {
if (xhr.status >= 200 && xhr.status < 300) {
console.log(xhr.responseText);
} else {
console.error('Request failed');
}
};
xhr.onerror = function() {
console.error('Request error');
};
xhr.send();
在这个例子中，浏览器会自动处理 CORS 请求，并根据服务器返回的 Access-Control-Allow-Origin 头信息决定是否允许访问。
二、JSONP（JSON with Padding）
JSONP 是一种通过动态插入