详解js跨域请求的两种方式，支持post请求

下面就详细讲解js跨域请求的两种方式，支持post请求的完整攻略：

什么是跨域请求

跨域请求是指浏览器通过Ajax等方式，发送一个请求到一个与当前页面不同域名的地址。在安全机制下，这个请求是不合法的，因为浏览器的同源策略要求一个页面只能够与同域下的接口进行交互。

JSONP跨域请求

JSONP是指利用script标签的跨域请求方式，通过动态生成script标签来向服务器发送请求，将服务器返回的数据作为JavaScript代码执行，最后将结果作为参数传递到回调函数中。这种跨域请求的原理是利用script标签没有跨域限制的特性。

以下是示例代码：

function getData(data) {
  console.log(data);
}
var script = document.createElement('script');
script.src = 'http://www.example.com/data?callback=getData';
document.head.appendChild(script);

CORS跨域请求

CORS是指跨域资源共享，它不使用script标签，而是通过XMLHttpRequest来实现跨域请求。CORS需要在服务器端设置Access-Control-Allow-Origin响应头，标识该服务器允许来自哪些域名的请求。

以下是示例代码：

var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://www.example.com/data', true);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onload = function() {
  console.log(xhr.responseText);
};
xhr.send(JSON.stringify({
  data: 'some data'
}));

总结

以上就是详解js跨域请求的两种方式，支持post请求的完整攻略，其中JSONP利用script标签，CORS则是使用XMLHttpRequest，都可以实现跨域请求。对于选择什么方式，要根据实际需求和后台接口的支持情况来决定。