解决跨域调用服务并设置headers 主要的解决方法需要通过服务器端设置响应头、正确响应options请求，正确设置 JavaScript端需要设置的headers信息 方能实现。

1.什么是跨域？

跨域：指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。

例如：a页面想获取b页面资源，如果a、b页面的协议、域名、端口、子域名不同，所进行的访问行动都是跨域的，而浏览器为了安全问题一般都限制了跨域访问，也就是不允许跨域请求资源。注意：跨域限制访问，其实是浏览器的限制。理解这一点很重要！！！

同源策略：是指协议，域名，端口都要相同，其中有一个不同都会产生跨域；

解决办法

方法一 服务端设置响应头

header('Access-Control-Allow-Origin:*'); //支持全域名访问，不安全，部署后需要固定限制为客户端网址

header('Access-Control-Allow-Methods:POST,GET,OPTIONS,DELETE'); //支持的http 动作

header('Access-Control-Allow-Headers:x-requested-with,content-type'); //响应头 请按照自己需求添加。

方法二：一顿百度，可以用jsonp解决，具体方法步骤如下

(function($){
$.ajax({
        type: "post",
        url: "http://localhost:8022/test.json",
        data: $.toJSON(userData),
        dataType: 'jsonp',
        jsonpCallback:'callback',
        success: function(result) {
            alert(result);
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            alert(XMLHttpRequest.status);
            alert(XMLHttpRequest.readyState);
            alert(textStatus);
        }
    });
})(jQuery)

原文链接：https://www.jianshu.com/p/0f25e13eef0e