javascript跨域

协议、域名、端口有任何一个不同,都被当作是不同的域,如果请求的域和当前服务器不同,就涉及到跨域.关于什么是跨域共享CORS,请看阮老师的文章跨域资源共享 CORS 详解以及一篇网友的博客js中几种实用的跨域方法原理详解,最常用的应该就是jsonp、CROS和过程调用.
jsonp代码如下

$.ajax({
    type: "get",
    async: false,
    url: "http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998",
    dataType: "jsonp",
    jsonp: "callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
    jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
    success: function(json){
        alert('您查询到航班信息:票价: ' + json.price + ' 元,余票: ' + json.tickets + ' 张。');
    },
    error: function(){
        alert('fail');
    }
});

CROS

var url = 'http://api.alice.com/cors';
var xhr = new XMLHttpRequest();
xhr.open('PUT', url, true);
xhr.setRequestHeader('X-Custom-Header', 'value');
xhr.send();

过程调用(以hprose为例)

var client = hprose.Client.create('http://api.car.com/Index', ['recommend']);
client.recommend(param, function (result) {
    console.log(result);

}, function (name, err) {
    console.log(err); 

});

服务器配置,以apache为例

<VirtualHost *:80>
	DocumentRoot D:/repository/car
	ServerName api.car.com
    Header set Access-Control-Allow-Origin "http://m.car.com"
    Header set Access-Control-Allow-Methods "GET,POST,OPTIONS"
    Header set Access-Control-Allow-Headers "Content-Type"
    Header set Access-Control-Allow-Credentials "true"
</VirtualHost>

Header set Access-Control-Allow-Origin允许哪个域可以访问,
Header add Access-Control-Allow-Methods允许的访问方式
如果有权限修改API接口,在不修改服务器的情况下可以做如下修改

header("Access-Control-Allow-Origin:*");
header("Access-Control-Allow-Credentials:true");

同时修改httpd.conf文件,取消注释

LoadModule headers_module modules/mod_headers.so

否则apache会报如下错误:

原文地址:https://www.cnblogs.com/foolishnoob/p/5650832.html