問(wèn)題描述

jquery的請(qǐng)求如下：

angularjs的請(qǐng)求如下：

問(wèn)題解答

你仔細(xì)看下你的兩個(gè)請(qǐng)求在request上的差異，我說(shuō)的是content-type這個(gè)部分，jquery默認(rèn)的content-type是application/x-www-form-urlencoded，是簡(jiǎn)單請(qǐng)求，不需要preflight（就是第二張圖里的options請(qǐng)求）。而angular默認(rèn)的post請(qǐng)求的content-type是application/json，這是復(fù)雜請(qǐng)求，主要進(jìn)行preflight，但你既然碰到錯(cuò)誤了，就說(shuō)明你的后端并沒(méi)有處理options情況，兩個(gè)解決辦法：

手動(dòng)給你的angular resource服務(wù)設(shè)置header，將content-type改成application/x-www-form-urlencoded。（不確定resources是否可以自定義header，因?yàn)閞esources其實(shí)是標(biāo)準(zhǔn)restful服務(wù)）

要求你的后端程序做相應(yīng)修改，使之能夠處理復(fù)雜請(qǐng)求（實(shí)際是非常小的改動(dòng)，無(wú)論java, python還是ruby on rails都有現(xiàn)成的解決方案）

你注意看 你用jquery發(fā)送請(qǐng)求的時(shí)候，響應(yīng)的Response Headers設(shè)置了 Access-Control-Allow-Origin,因此你可以跨域；但是你用Angular發(fā)送的時(shí)候這個(gè)頭沒(méi)有，應(yīng)該是你服務(wù)器端響應(yīng)的邏輯做了什么判斷，導(dǎo)致這個(gè)頭沒(méi)有正常設(shè)置。

@依云 并不是 Angular 認(rèn)為需要 preflight，而是瀏覽器認(rèn)為（由于 Angular 對(duì) HTTP 請(qǐng)求的配置，Content-Type 和 Cache-Control，根據(jù) MDN 文檔）需要發(fā)起 preflight。

@YAN_YANG 從響應(yīng)頭來(lái)看，你的服務(wù)器允許 preflight 請(qǐng)求，你可以從服務(wù)端把這個(gè)刪掉。不清楚你是怎么配置 CORS 的，舉個(gè)例子比如在 Apache 里有類似的設(shè)置：

Header set Access-Control-Allow-Methods 'PUT, GET, POST, DELETE, OPTIONS'

把 OPTIONS 選項(xiàng)去掉可以直接避免去響應(yīng) preflight，當(dāng)然你合理的處理它才是正確的。（參見(jiàn)：http://stackoverflow.com/questions/23954433/post-request-with-angularj...）

另外你 Angular 那邊設(shè)置了正確的 request headers 嗎？（針對(duì) CORS 的）

http://chstrongjavablog.blogspot.sg/2013/04/enabling-cors-for-jetty.ht...

這篇文章解釋了 OPTIONS 的種種困擾，以及為什么 jQuery 沒(méi)問(wèn)題（針對(duì) CORS 專門(mén)去除了 HEADER），另外還有一個(gè) Java 的 CORS 實(shí)現(xiàn)，和請(qǐng)求時(shí) HEADER 的設(shè)置。Angular 怎么設(shè)，查 $httpProvider 的文檔即可。