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"
  1. 带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;跨域也解决了。

关注我

你可能感兴趣的:(Ajax跨域完全理解)