Ajax跨域完全理解

1. AJAX跨域完全问题的原因

• 浏览器出于安全考虑，特定限制

• 请求是跨域的

• 请求方式是XHR请求

2. 解决思路

• 让浏览器不做限制,后台不需要改动后台

• 请求类型不为xhr（jsonp）

jsonp 需要后台进行改动
返回的类型为JavaScript类型
jsonp是动态创建script脚本 并且立即销毁

jsonp的弊端：1. 改服务器代码；2. 只能是get请求；3. 发送的不是xhr请求

• 服务器端解决

3. 解决方法(服务端解决)

服务器过滤器实现

1. 通过filter给请求头加上跨域地址

"Access-Control-Allow-Origin":"*"
//*表示允许所有，也可指定特定的域名地址
"Access-Control-Allow-Methods":"*"
// 有时候也会需要设置这个，如果请求头设置了自定义头类型  
"Access-Control-Allow-Header":"Content-Type"

// 可以通过下面设置预警命令缓存
"Access-Control-Max-Age":"3600"

2. 带cookie的跨域请求
   设置"Access-Control-Allow-Origin":"*"不行，必须为全匹配
   然后还需要加上"Access-Control-Allow-Credentials":"true"

如果设置为特定匹配的话 ，还可以从请求头中取出origin，再通过filter设置到响应头里面去

nginx实现

在虚拟主机对应的conf配置文件下修改（意思参照nginx）

server{
    listen 80;
    server_name b.com;
    location / {
        proxy_pass http://lcoalhost:8080/;
        add_header Access-Control-Allow-Methods *;
        add_header Access-Control-Max-Age3600;
        add_header Access-Control-Allow-Credentials true*;

        add_header Access-Control-Allow-Methods  $http_origin  ;
        add_header Access-Control-Allow-Methods  $http_access_control_request_headers;
        
        if($request_method = OPTIONs){
            return 200;
        }
    }
}

Apache实现

在虚拟主机对应的conf配置文件下修改

虚拟主机部分配置 请求头部分配置

Spring框架实现

通过给action加上@CrossOrigin注解

隐藏跨域

处理调用地址 通过反向代理

server{
    listen 80;
    server_name a.com;
    location / {
        proxy_pass http://lcoalhost:8080/;
    }
    location /ajaxserver {
        proxy_pass http://lcoalhost:8081/test;
    }
}

请求 a.com/ajaxserver 就会转发 到lcoalhost:8081/test;跨域也解决了。

关注我