跨域资源共享（CORS）应用案例

1、跨域资源共享介绍：
       当使用ajax跨域请求时，浏览器报错：XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin.肯定是跨域的问题，如果用jsonp或者proxy的方式进行修改的话未免需要太大的工程量，所以采用CORS这种比较简单高效的技术。相比JOSP的方式，CORS更为高效。JSONP由于它的原理只能实现GET请求，而CORS支持所有类型的HTTP请求。使用CORS,可以使用普通的ajax实现跨域，这对于前端来说是极大的福音了,这个技术被现在大多数浏览器所普遍支持，因为跨域已经是普遍的要求，浏览器肯定会逐渐流出适当的‘后门’出来专门用以跨域。
2、跨域资源共享实例：
       本实例介绍的是Java语言下跨域资源共享，其他的也与此类似。
2.1、编写过滤器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;

public class CORSFilter implements Filter {

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

	@Override
	public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain chain)
			throws IOException, ServletException {
		HttpServletResponse response = (HttpServletResponse) servletResponse;  
		//跨域响应会携带该字段，若服务器允许所有uri来访问自己的资源，那么则该字段为*；若要允许http://www.qq.com访问该资源，则为Access-Control-Allow-Origin: http://www.qq.com。
        response.setHeader("Access-Control-Allow-Origin", "*");  
        //Access-Control-Allow-Methods表示服务器访问操作该资源允许哪些方法
        response.setHeader("Access-Control-Allow-Methods", "GET,POST,HEAD,PUT,DELETE");  
        //Access-Control-Max-Age表示预检请求结果请求成功后，多长时间内非简单请求可以不需要再发预检请求，可以继续直接使用跨域请求请求资源
        response.setHeader("Access-Control-Max-Age", "3600");  
        //Access-Control-Allow-Headers表示在访问这个域资源的时候，预检请求响应中哪些header字段可以在跨域请求中使用。
        response.setHeader("Access-Control-Allow-Headers", "Accept,Origin,X-Requested-With,Content-Type,X-Auth-Token");  
        //Access-Control-Allow-Credentials:该字段可选。它的值是一个布尔值，表示是否允许发送Cookie。默认情况下，Cookie不包括在CORS请求之中。设为true，即表示服务器明确许可，Cookie可以包含在请求中，一起发给服务器。这个值也只能设为true，如果服务器不要浏览器发送Cookie，删除该字段即可。
        response.setHeader("Access-Control-Allow-Credentials", "true");  
		chain.doFilter(servletRequest, servletResponse);
	}

	@Override
	public void destroy() {
		
	}

}

2.2在web.xml中配置上述中的过滤器：

    <filter>
		<filter-name>CorsFilter</filter-name>
		<filter-class>org.framework.core.filter.CORSFilter</filter-class>
	</filter>
	<filter-mapping>
		<filter-name>CorsFilter</filter-name>
		<url-pattern>/*</url-pattern>
   </filter-mapping>

2.3前端ajax实现跨域资源共享：

$.ajax({
	      async : false,
	      cache : false,
	      type : 'POST',
	      url : url,// 请求的action路径，即跨域请求路径，这个路径必须是被跨域服务允许访问的路径。
	      data :{},
	      crossDomain: true,//默认为false，在跨域的情况下这个值必须设置为true。
	      xhrFields: {
	          withCredentials: true
	      },
	      dataType:"json",
	      timeout : 1000, //超时时间设置，单位毫秒
	      error : function(XMLHttpRequest,textStatus,errorThrown) {// 请求失败处理函数
	    	  alert(XMLHttpRequest.status);
	    	  alert(textStatus);
	    	  alert("访问错误！！！！");
	      },
	      success : function(data) {
	        if (data.success) {
	        	alert("访问成功！！！！");
	       } else {
				alert("访问失败！！！！");
	        }
	      }
	    });

经过这三步的设置就能实现跨域资源共享。