![](/img/trans.png)
[英]IE CORS - Access-Control-Allow-Headers error even though headers are specified
[英]Request header was not present in the Access-Control-Allow-Headers list
在我的API中,我有以下代碼:
public class CustomOAuthProvider : OAuthAuthorizationServerProvider
{
public override Task MatchEndpoint(OAuthMatchEndpointContext context)
{
if (context.OwinContext.Request.Method == "OPTIONS" && context.IsTokenEndpoint)
{
context.OwinContext.Response.Headers.Add("Access-Control-Allow-Methods", new[] { "POST" });
context.OwinContext.Response.Headers.Add("Access-Control-Allow-Headers",
new[] {
"access-control-allow-origin",
"accept",
"x-api-applicationid",
"content-type",
"authorization"
});
context.OwinContext.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });
context.OwinContext.Response.StatusCode = (int)HttpStatusCode.OK;
context.RequestCompleted();
return Task.FromResult<object>(null);
}
return base.MatchEndpoint(context);
}
// ... even more code, but not relevant
}
當我從Chrome連接到此API時,一切都很完美。 當我從同一台計算機連接到同一個API,但只從另一個瀏覽器Internet Explorer 11,我收到以下錯誤:
SEC7123:Access-Control-Allow-Headers列表中不存在請求標頭x-api-applicationid。
我調試了代碼,我看到標題已添加到響應中。 甚至IE顯示標題:
IE期待什么?
更新
如果我更改標題的順序
new[] {
"access-control-allow-origin",
"accept",
"x-api-applicationid",
"content-type",
"authorization"
}
至:
new[] {
"content-type",
"accept",
"access-control-allow-origin",
"x-api-applicationid",
"authorization"
}
錯誤消息更改為:
SEC7123:Access-Control-Allow-Headers列表中不存在請求標頭access-control-allow-origin 。
因此它總是在第三個標題上給出錯誤。
確保它不像AJAX中內容類型標題的拼寫錯誤那么簡單。 我正在使用帶有application/x-www-form-urlencoded
內容類型的OPTIONS預檢,這不需要預檢,但我有
content-type: application/x-www-form-urlencoded
代替
application/x-www-form-urlencoded
作為我的contentType
選項。
錯誤:
$.ajax({
url: 'http://www.example.com/api/Account/Token',
contentType: 'content-type: application/x-www-form-urlencoded',
method: 'POST',
data: {
grant_type: "password",
username: $('#username').val(),
password: $('#password').val()
},
});
對:
$.ajax({
url: 'http://www.example.com/api/Account/Token',
contentType: 'application/x-www-form-urlencoded',
method: 'POST',
data: {
grant_type: "password",
username: $('#username').val(),
password: $('#password').val()
},
});
我在這里找到了一段代碼,為我修好了。
//Startup.cs
public void ConfigureOAuth(IAppBuilder app)
{
app.Use(async (context, next) =>
{
IOwinRequest req = context.Request;
IOwinResponse res = context.Response;
if (req.Path.StartsWithSegments(new PathString("/oauth2/token")))
{
var origin = req.Headers.Get("Origin");
if (!string.IsNullOrEmpty(origin))
{
res.Headers.Set("Access-Control-Allow-Origin", origin);
}
if (req.Method == "OPTIONS")
{
res.StatusCode = 200;
res.Headers.AppendCommaSeparatedValues("Access-Control-Allow-Methods", "GET", "POST");
res.Headers.AppendCommaSeparatedValues("Access-Control-Allow-Headers", "authorization", "content-type", "x-api-applicationid", "access-control-allow-origin");
return;
}
}
await next();
});
// rest of owin Oauth config
}
我從CustomOAuthProvider.cs中刪除了MatchEndpoint
方法
無需刪除MatchEndPoint
只需在Access-Control-Allow-Headers中添加逗號分隔值作為第一個數組元素,而不是添加數組元素
代替
context.OwinContext.Response.Headers.Add("Access-Control-Allow-Headers",
new[] {
"access-control-allow-origin",
"accept",
"x-api-applicationid",
"content-type",
"authorization"
});
使用
context.OwinContext.Response.Headers.Add("Access-Control-Allow-Headers",
new[] {
"access-control-allow-origin,accept,x-api-applicationid,content-type,authorization"
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.