Ajax跨域問題

錯誤信息

XMLHttpRequest cannot load “url” 
'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://localhost' is therefore not allowed access.

分析

• Access control allow origin直譯過來就是"訪問控制允許同源"，這是由於ajax跨域訪問引起的。所謂跨域就是，在a.com域下，訪問b.com域下的資源；出於安全的考慮，瀏覽器允許跨域寫，而不允許跨域讀，寫就是上行，發送請求，send request,讀就是下行，接受響應，receive response；理解了這兩條規則，以下現象我們也就能理解了。

1. 表單默認提交（get、post）、超鏈接訪問域外的資源，這是允許的，因爲在點擊按鈕/超鏈接時，瀏覽器地址已經變了，這就是一個普通的請求，不存在跨域
2. ajax(藉助xmlhttprequest)跨域請求，這是被禁止的，因爲ajax就是爲了接受接受響應，這違背了，不允許跨域讀的原則
3. jsonp屬於跨域讀且形式限制爲GET方式，它利用了script標籤的特性；這是允許的。因爲瀏覽器把跨域讀腳本，當作例外，類似的img、iframe的src都可以請求域外資源

解決方法（CORS）

• 添加過濾器

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 SimpleCORSFilter implements Filter {

    @Override
    public void destroy() {
    }

    @Override
    public void doFilter(ServletRequest req, ServletResponse res,FilterChain chain) throws IOException, ServletException {
        HttpServletResponse response = (HttpServletResponse) res;
        response.setHeader("Access-Control-Allow-Origin", "*");
        response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Headers", "x-requested-with");
        chain.doFilter(req, res);
    }

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

}

• web.xml

	<!-- 跨域請求 -->
	<filter>
		<filter-name>SimpleCORSFilter</filter-name>
		<filter-class>qiangduanyang.controller.other.SimpleCORSFilter</filter-class>
	</filter>
	<filter-mapping>
		<filter-name>SimpleCORSFilter</filter-name>
		<url-pattern>/*</url-pattern>
	</filter-mapping>

參考文章1 參考文章2