Windows身份验证和Angular 4应用程序 [英] Windows Authentication and Angular 4 application

问题描述

我正在编写一个Angular 4应用程序，该应用程序需要从Asp.Net WebApi获取一些数据.我们正在对WebAPI使用Windows身份验证，我想知道如何将用户的Windows身份从我的Angular应用程序传递到WebApi.我发现了几个示例，这些示例涉及将您的应用程序与MVC应用程序嵌套在一起，但我希望UI远离MVC.有没有一种方法可以不将.net mvc添加到我的Angular网站中?

I am writing an Angular 4 application that needs to get some data from Asp.Net WebApi. We are using windows authentication for the WebAPI and I am wondering how I can pass user's windows identity from my Angular Application to WebApi. I've found couple examples that are involving nesting your application with MVC application but I would to keep UI away from MVC. Is there a way to do it without adding .net mvc to my Angular website?

推荐答案

当您将Http请求从Angular发送到WebAPI时，您需要使用 RequestOptions({withCredentials = true})

When you send your http request from Angular to your WebAPI you need to use RequestOptions({ withCredentials=true})

这是调用api的示例安全服务

Here's a sample security service that calls an api

@Injectable()
export class SecurityService {
private baseUrl = 'http://localhost:64706/api/security/';
private auth: Auth;
private options = new RequestOptions({ withCredentials: true });

constructor(private http: Http) {
    console.log('Creating Service');

    console.log('Service Pre Http');

    this.http.get(this.baseUrl, this.options)
      .map((res) => this.extractData<Auth>(res))     
      .subscribe(newItem => {
        console.log('Service Subscribe');
        this.auth = newItem;
      })

  }

  public isUser(): Observable<boolean> | boolean {

    if (!this.auth) {
      return this.http.get(this.baseUrl, this.options)
        .map(res => {
          this.auth = this.extractData<Auth>(res);
          return this.auth.isUser;
        });
    }
    else {
      return this.auth.isUser;
    }


  }

  private extractData<T>(res: Response) {
    if (res.status < 200 || res.status >= 300) {
      throw new Error('Bad response status: ' + res.status);
    }
    const body = res.json ? res.json() : null;
    return <T>(body || {});
  }

}

这是auth类

export class Auth {
  isAdmin: boolean;
  isUser: boolean;
}

如果您使用的是.net Core，则现在可以在WebAPI Controller中访问 this.User.Identity.IsAuthenticated

If you are using .net Core then in your WebAPI Controller you can now access this.User.Identity.IsAuthenticated

注意::如果您使用的是ASP.Net Core 2.0，则需要在此处遵循"Windows身份验证(HTTP.sys/IISIntegration)"部分 https://docs.microsoft.com/en-us/aspnet/core/migration/1x-to-2x/identity-2x

NB: If you are using ASP.Net Core 2.0 then you need to follow the "Windows Authentication (HTTP.sys / IISIntegration)" section here https://docs.microsoft.com/en-us/aspnet/core/migration/1x-to-2x/identity-2x

您还必须记住在主机(例如IIS或IISExpress)上启用Windows身份验证.

You must also remember to enable Windows Authentication on the host e.g IIS or IISExpress.

您可能需要启用CORS，这里的文档很好: https://docs.microsoft.com/en-us/aspnet/core/security/cors

You will likely need to enable CORS the documentation here is good: https://docs.microsoft.com/en-us/aspnet/core/security/cors

如果您在预检检查"中遇到错误，则还需要启用匿名访问

If you get errors around "preflight checks" then you will also need to enable Anonymous Access

这篇关于Windows身份验证和Angular 4应用程序的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！