使用ASP登录Angular 2.. NET身份令牌

Question

我正在开发一个Angular 2应用程序，它正在向ASP. js调用服务。. NET Web API 2服务。在此服务中，CORS已在WebApiConfig中启用，如下所示:

public static class WebApiConfig
{
    public static void Register(HttpConfiguration config)
    {
        ...
        var cors = new EnableCorsAttribute("*", "*", "*");
        config.EnableCors(cors);
        ...
    }
}

这一直工作良好，我没有任何问题与CORS。例如，调用/api/users成功检索所有用户。

现在，然而，我正试图使用。net身份令牌登录功能，这给了我与CORS相关的问题。当调用/token执行登录在我的login.service.ts:

loginUser(username: string, password: string) {
    let serviceURL = 'http://myurl/token';
    let body = 'username=' + username + '&password=' + password + '&grant_type=password';
    let headers: Headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded');
    let options: RequestOptions = new RequestOptions({
        headers: headers
    });
    return this.http.post(serviceURL, body, options)
        .map(res => this.extractData(res))
        .catch(this.handleError);
}

我得到以下错误:

XMLHttpRequest cannot load http://myurl/token. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 400.

我觉得这很令人困惑，有两个原因:

1. 如上所述，我没有任何/api呼叫CORS问题
2. 当我输入正确的凭据调用是"成功的"(即Status Code 200，但我得到上面列出的错误。

我已经看了很多类似实现的文章，但我似乎找不到我的问题。

Answer 1

好了，我终于找到了发生这种情况的原因。正如这里突出显示的那样，/token端点似乎是在WebApiConfig之前初始化的，因此这里的任何设置都不会为/token端点启用CORS。

要为这个端点启用它，应该在IdentityConfig.cs Create函数中添加以下内容:

public static ApplicationUserManager Create(IdentityFactoryOptions<ApplicationUserManager> options, IOwinContext context)
{
    context.Response.Headers.Add("Access-Control-Allow-Origin", new[] { "*" });
    ...
}