1：处事器端口纷歧致
2：协议纷歧致
3：域名纷歧致
办理方案：
1.jsonp
在长途处事器上设法动态的把数据装进js名目标文本代码段中，供客户端挪用和进一步处理惩罚；在前台通过动态添加script标签及src属性，外貌看上去与ajax极为相似，可是，这和ajax并没有任何关系；为了便于利用及交换，逐渐形成了一中非正式传输协议，人们把它称作 jsonp 。
代码如下：
html：
<body> <form action="https://www.jb51.net/" method="post" enctype="multipart/form-data"> <input type="text"><br> <input type="file"><br> <input type="button" value="提交"> </form> </body> <script src="https://www.jb51.net/article/jquery.js"></script> <script> //提前写好函数，挪用函数需要传参 function callback(data){ alert(data); } //动态添加script标签及src属性 $('#btn').on('click',function(){ var sc = document.createElement('script'); sc.src = 'http://soul:8888/kuayu?cb=callback'; $('head').append(sc); }) </script>
js：
var http = require('http'); var url = require('url'); var server = http.createServer(); server.listen('8888',function(){ console.log('8888'); }); server.on('request',function(req,res){ var urls = url.parse(req.url,true); if(urls.pathname == '/kuayu'){ res.end('callback("jsonp")');//返回的数据需是前端界说的函数挪用的形式 } });
运行功效：
总结一下：
jsonp的一个要点就是答允用户通报一个callback参数给处事端， 然后处事端返回数据时会将这个callback参数作为函数名来包裹住JSON数据， 这样客户端就可以随意定制本身的函数来自动处理惩罚返回数据了。
发明每每拥有"src"这个属性的标签都拥有跨域的本领，好比script、img、iframe； src 的本领就是把长途的数据资源加载到当地(图片、JS代码等);
2.cors
cors跨域的焦点点是在处事端代码中配置一个响应头即可
res.setHeader('Access-Control-Allow-Origin','*');
html：
<body> <form action="https://www.jb51.net/" method="post" enctype="multipart/form-data"> <input type="text"><br> <input type="button" value="提交"> </form> </body> <script src="https://www.jb51.net/article/jquery.js"></script> <script> $('#btn').on('click', function () { $.ajax({ url: 'http://soul:8888/kuayu', type:'delete', async:false, success: function (data) { alert(data); }, }) }) </script>
js代码：
<body> <form action="https://www.jb51.net/" method="post" enctype="multipart/form-data"> <input type="text"><br> <input type="button" value="提交"> </form> </body> <script src="https://www.jb51.net/article/jquery.js"></script> <script> $('#btn').on('click', function () { $.ajax({ url: 'http://soul:8888/kuayu', type:'delete', async:false, success: function (data) { alert(data); }, }) }) </script>
结果：
许多人也认为利用CORS办理跨域很简朴，只需要在处事器添加响应头 “ Access-Control-Allow-Origin ：* ” 就可以了，
其实否则，因为在CORS中，所有的跨域请求被分为了两种范例，一种是简朴请求，一种是巨大请求 (严格来说应该叫‘需预检请求')；简朴请求与普通的ajax请求无异；但巨大请求，必需在正式发送请求前先发送一个OPTIONS要领的请求已得随处事器的同意，若没有得随处事器的同意，欣赏器不会发送正式请求；
满意以下所有条件，被视为简朴范例的请求：
1：请求要领必需是 GET、HEAD、POST中的一种，其他要领不可；
2：请求头范例只能是 Accept、Accept-Language、Content-Language、Content-Type，添加其他特别请求头不可；
3：请求头 Content-Type 假如有，值只能是 text/plain、multipart/form-data、application/x-www-form-urlencoded 中的一种，其他值不可；
4：请求中的任意 XMLHttpRequestUpload 工具均没有注册任何事件监听器；
5：请求中没有利用 ReadableStream 工具。（以上摘自西岭老湿微信公家号）
总结一下：
假如请求方法为get和post简朴请求，则只需要配置响应头：res.setHeader('Access-Control-Allow-Origin','*');来答允某一个域 可能 所有域举办数据共享；
若是其他方法的请求，会在发送真正的请求之前发送一个options请求，通过options请求里配置：res.setHeader('Access-Control-Allow-Methods', 'DELETE')，
奉告处事器正式请求会利用哪一种 HTTP 请求要领。
总结