Ajax跨域解决方案

这段时间，刚换了新的公司，那有些闲暇时间都会去游览当地，所以博客就落下了，尽快补回来，每天一篇。

跨域资源共享（CORS）

Cross-Origin Resource Sharing (CORS) 是W3c工作草案，它定义了在跨域访问资源时浏览器和服务器之间如何通信。CORS背后的基本思想是使用自定义的HTTP头部允许浏览器和服务器相互了解对方，从而决定请求或响应成功与否。
Cors原理：
众所周知出于安全的考虑，浏览器有个同源策略，对于不同源的站点之间的相互请求会做限制（跨域限制是浏览器行为，不是服务器行为。）同源指的是域名（或IP），协议，端口都相同，不同源的客户端脚本(JavaScript、ActionScript)在没明确授权的情况下，不能读写对方的资源。
跨域的判定流程：
浏览器先根据同源策略对前端页面和后台交互地址做匹配，若同源，则直接发送数据请求；若不同源，则发送跨域请求。
服务器解析程序收到浏览器跨域请求后，根据自身配置返回对应文件头。若未配置过任何允许跨域，则文件头里不包含Access-Control-Allow-origin字段，若配置过域名，则返回Access-Control-Allow-origin+对应配置规则里的域名的方式。
浏览器根据接受到的http文件头里的Access-Control-Allow-origin字段做匹配，若无该字段，说明不允许跨域；若有该字段，则对字段内容和当前域名做比对，如果同源，则说明可以跨域，浏览器发送该请求；若不同源，则说明该域名不可跨域，不发送请求
Cors配置项解析：
1. Access-Control-Allow-Origin（必含） – 允许的域名，只能填通配符或者单域名
2. Access-Control-Allow-Methods（必含） – 这允许跨域请求的http方法（常见有POST、GET、OPTIONS）
3. Access-Control-Allow-Headers（当预请求中包含Access-Control-Request-Headers时必须包含） – 这是对预请求当中Access-Control-Request-Headers的回复，和上面一样是以逗号分隔的列表，可以返回所有支持的头部。
4. Access-Control-Allow-Credentials（可选） – 该项标志着请求当中是否包含cookies信息，只有一个可选值：true（必为小写）。如果不包含cookies，请略去该项，而不是填写false。这一项与XmlHttpRequest2对象当中的withCredentials属性应保持一致，即withCredentials为true时该项也为true；withCredentials为false时，省略该项不写。反之则导致请求失败。
5. Access-Control-Max-Age（可选） – 以秒为单位的缓存时间。预请求的的发送并非免费午餐，允许时应当尽可能缓存

业务场景：
Ajax请求不同项目或跨域等
实际代码：
1.创建cors过滤器

/**  
* @Title: CorsFilter.java
* @Package com.cn.cd.autotimes.corsfilter
* @Description: Cors_Filter
* @author lei.gao
* @date 2016年10月20日 上午9:52:45
* @version V1.0  
*/ 
package com.cn.cd.autotimes.corsfilter;

import java.io.IOException;

import javax.servlet.Filter;
import javax.servlet.FilterChain;
import javax.servlet.FilterConfig;
import javax.servlet.ServletException;
import javax.servlet.ServletRequest;
import javax.servlet.ServletResponse;
import javax.servlet.http.HttpServletResponse;

/**
* @ClassName: CorsFilter
* @Description: cors处理ajax跨域问题
* @author lei.gao
* @date 2016年10月20日 上午9:52:45
*
*/
public class CorsFilter implements Filter {

    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)
            throws IOException, ServletException {

        HttpServletResponse res = (HttpServletResponse)response;

        res.setHeader("Access-Control-Allow-Origin", "*");
        res.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
        res.setHeader("Access-Control-Max-Age","3600");   
        res.setHeader("Access-Control-Allow-Headers","x-requested-with,content-type");

        chain.doFilter(request, response);

    }

    @Override
    public void init(FilterConfig arg0) throws ServletException {   }
    @Override
    public void destroy() { }
}

2.在web.xml配置

    <filter>
        <filter-name>cors</filter-name>
        <filter-class>com.cn.cd.autotimes.corsfilter.CorsFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>cors</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

这样我们的跨域问题就解决了，当然还可以与springMVC结合，原理是一样的。

呐！其实ajax的跨域还是很好解决的，当然方法有多种多样，我只是举出其中一项而已，不足之处请多指正，我是黑猫,我在这里。

Ajax跨域解决方案

Ajax跨域解决方案

猜你喜欢