[英]CORS request with AngularJS and Spring
我知道有很多與此類問題有關的信息,但是我閱讀的所有解決方案對我而言都不奏效。
因此,我將把代碼留在這里,也許您可以弄清楚發生了什么事,因為我要把我的計算機扔進窗戶。
我單擊一個按鈕打到我的其余服務器的Ajax請求時遇到此錯誤:
XMLHttpRequest cannot load http://localhost:8081/XXXXXXX.
Request header field Access-Control-Allow-Origin is not allowed
by Access-Control-Allow-Headers in preflight response.
當然,我已經在客戶端(AngularJS)的請求中添加了標頭:
all : function() {
return $http({
method : 'GET',
url : url_base + '/XXXXXXXX',
headers:{
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Methods': 'GET, POST, PUT, DELETE, OPTIONS',
'Access-Control-Allow-Headers': 'Content-Type, X-Requested-With',
'X-Random-Header':'123123123'
}
});
}
在服務器端,我在web.xml文件中添加了一個過濾器:
<filter>
<filter-name>CORSFilter</filter-name>
<filter-class>
filters.CORSFilter
</filter-class>
</filter>
<filter-mapping>
<filter-name>CORSFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
然后添加一個實現filter接口的類:
package filters;
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;
import org.springframework.stereotype.Component;
@Component
public class CORSFilter implements Filter {
@Override
public void init(FilterConfig arg0) throws ServletException {}
@Override
public void doFilter(ServletRequest req, ServletResponse resp,
FilterChain chain) throws IOException, ServletException {
// TODO Auto-generated method stub
HttpServletResponse response=(HttpServletResponse) resp;
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, resp);
}
@Override
public void destroy() {}
}
過濾器會自動將CORS標頭添加到任何響應,因此我將過濾器添加到任何模式。
如您所見,這就是請求和響應標頭,它們具有CORS標頭,但我不太確定發生了什么。
響應標題
Access-Control-Allow-Headers:x-requested-with
Access-Control-Allow-Methods:POST, GET, OPTIONS, DELETE
Access-Control-Allow-Origin:*
Access-Control-Max-Age:3600
Allow:GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS, PATCH
Content-Length:0
Date:Sat, 28 Nov 2015 08:48:08 GMT
Server:Apache-Coyote/1.1
**Request Headers**
view source
Accept:*/*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:es-ES,es;q=0.8
Access-Control-Request-Headers:accept, access-control-allow-headers, access-control-allow-methods, access-control-allow-origin, x-random-header
Access-Control-Request-Method:GET
Connection:keep-alive
Host:localhost:8081
Origin:http://127.0.0.1:8080
Referer:http://127.0.0.1:8080/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2490.86 Safari/537.36
我在這里通過Rest Spring API閱讀了有關@CorsOrigin
,但我不知道我沒有可用的注釋,因此未進行編譯。 也許我需要向我的POM添加一個新的特定庫?
不要在AngularJS的請求中添加任何標題。
只需在您的web.xml中添加此過濾器,它就是一個過濾器: 在這里解釋
<filter>
<filter-name>CorsFilter</filter-name>
<filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>CorsFilter</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>
這將告訴Tomcat允許CORS請求。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.