[英]AngularJS CORS request custom header
我無法在與AngularJS結合使用的服務器上啟用CORS。 我正在使用Angular 1.2.16,這是我的服務器配置:
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Headers "Content-Type, X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Date, X-Api-Version, X-File-Name, Authorization"
Header set Access-Control-Allow-Methods "POST, GET, PUT, DELETE, OPTIONS"
Header set Access-Control-Allow-Credentials "true"
我可以使用以下請求:
$http.post(configuration.authUrl, {username: 'username', password: 'password'})
.success(function (data) {
$cookieStore.put(configuration.sessionName, {
token: data.authenticationToken,
user: data.user
});
})
.error(function () {}));
因為此請求不使用自定義標頭。
當我以后嘗試請求以下內容時: Balance.get()
的余額為:
angular.module('portalApp')
.factory('Balance', ['$resource', 'Auth', 'configuration', function ($resource, Auth, configuration) {
return $resource(configuration.balanceUrl, {}, {
get: {
method: 'GET',
isArray: false,
headers: {
Authorization: Auth.getAuthToken()
}
}
});
}]);
我在balanceUrl上收到401 Unauthorized
。
在配置中,我輸入了:
$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];
我什至嘗試放入$http.defaults.headers.common.Authorization = Auth.getAuthToken();
在Balance
資源工廠的$resource
之前,但這沒有幫助。
不管我使用哪種方法,發送到預檢OPTIONS
請求的標頭都沒有Authorization
標頭。 這些是預檢OPTIONS
請求的請求標頭。
OPTIONS /api/v1.0/user/orders HTTP/1.1
Host: host
Connection: keep-alive
Cache-Control: no-cache
Access-Control-Request-Method: GET
Pragma: no-cache
Origin: origin
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1916.153 Safari/537.36
Access-Control-Request-Headers: accept, authorization
Accept: */*
Referer: referer
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8
有什么建議么?
據我所知,您不能將Access-Control-Allow-Origin "*"
與Access-Control-Allow-Credentials "true"
。
經過大量研究,我發現問題並不是由於AngularJS或Apache配置引起的。 這是后端服務器應用程序(Java)中的問題。 所有HTTP方法的URL均受限制,因此當AngularJS要執行預檢OPTIONS
請求時,訪問被拒絕,並返回401
。
這是通過以下操作解決的:
if(!authenticationService.isTokenValid(glueToken) && !((HttpServletRequest)servletRequest).getMethod().equals(HttpMethod.OPTIONS.toString()) ){
response.setStatus(HttpServletResponse.SC_UNAUTHORIZED);
} else {
filterChain.doFilter(servletRequest, servletResponse);
}
代替:
if(!authenticationService.isTokenValid(glueToken)){
response.setStatus(HttpServletResponse.SC_UNAUTHORIZED);
} else {
filterChain.doFilter(servletRequest, servletResponse);
}
為什么不匿名(不執行身份驗證或授權)允許選項在飛行前請求。 https://stackoverflow.com/a/21458845/101662
我使用的是完全不同的方法,但前提仍然是相同的。
首先嘗試將Bearer放在訪問令牌的前面:
headers: {
Authorization: 'Bearer ' + Auth.getAuthToken()
}
如果沒有嘗試,請執行以下操作:如果沒有將應用程序設置為變量,則app.config可能無法工作,因此您可能需要進行調整。
app.config(
function($httpProvider) {
$httpProvider.defaults.headers.common = {};
$httpProvider.defaults.headers.post = {};
$httpProvider.defaults.headers.put = {};
$httpProvider.defaults.headers.patch = {};
$httpProvider.defaults.headers.common.Authorization = 'Bearer ' + Auth.getAuthToken();
}
);
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.