問題原因
跨域是指從一個域名的網頁去請求另一個域名的資源。瀏覽器出於安全的考慮，不允許不同源的請求：
解決方法
CORS
CORS是一個W3C標准，全稱是"跨域資源共享"（Cross-origin resource sharing）。它允許瀏覽器向跨源服務器，發出XMLHttpRequest請求，從而克服了AJAX只能同源使用的限制。
**CORS需要瀏覽器和服務器同時支持。目前，所有瀏覽器都支持該功能，IE瀏覽器不能低於IE10。 **
整個CORS通信過程，都是瀏覽器自動完成，不需要用戶參與。對於開發者來說，CORS通信與同源的AJAX通信沒有差別，代碼完全一樣。瀏覽器一旦發現AJAX請求跨源，就會自動添加一些附加的頭信息，有時還會多出一次附加的請求，但用戶不會有感覺。
因此，實現CORS通信的關鍵是服務器。只要服務器實現了CORS接口，就可以跨源通信。
Nginx設置
add_header 'Access-Control-Max-Age' 86400;
add_header Access-Control-Allow-Origin *;
add_header Access-Control-Allow-Credentials true;
add_header Access-Control-Allow-Methods GET,POST,OPTIONS,DELETE,PUT;
add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
對於IE8/9 需要使用jquery.xdomainrequest.min.js，並且添加相應header：
proxy_set_header 'Content-Type' 'application/json; charset=utf-8';
並且設置：
JQuery.support.cors = true;
JSONP
JSONP和JSON好像啊，他們之間有什么聯系嗎？
JSON(JavaScript Object Notation) 是一種輕量級的數據交換格式。對於JSON大家應該是很了解了吧，不是很清楚的朋友可以去json.org上了解下，簡單易懂。
JSONP是JSON with Padding的略稱。它是一個非官方的協議，它允許在服務器端集成Script tags返回至客戶端，通過javascript callback的形式實現跨域訪問（這僅僅是JSONP簡單的實現形式）
JS例子：
<script type="text/javascript">
$.ajax({
url:"http://localhost:20002/MyService.ashx?callback=?",
dataType:"jsonp",
jsonpCallback:"person",
success:function(data){
alert(data.name + " is a a" + data.sex);
}
});
</script>
Java端：
@RequestMapping(value = "/test", method = RequestMethod.GET)
public @ResponseBody JSONPObject test(HttpServletResponse response, String callback) {
Map<String, String> map = new HashMap<String, String>();
map.put("aaa", "I'm Dreamlu！");
return new JSONPObject(callback, map); //hellojsonp({"aaa":"I'm Dreamlu！"})
}
注意：JSONP需要服務端支持，不能簡單的配置Nginx實現
反向代理
通過把非同源請求用同源代理的方式來饒過跨域限制。
proxy_pass http://xxxxx/xxx.do
比較
- CORS對瀏覽器有要求，但對前后端的技術實現無改變
- JSONP對瀏覽器沒有要求，但其最終是通過GET方法訪問服務，限制了數據大小，並且對服務端技術實現有很大依賴
- 反向代理對瀏覽器和技術實現均無要求，但限制了部署的靈活性