AngularJS + ASP.NET Web API + ASP.NET MVC身份验证

20

我是AngularJS的新手,正在尝试为我的新Web应用程序评估它。

要求:

我将有一个ASP.NET Web API,将从Android、iPhone和Web应用程序(ASP.NET MVC)中使用。 Web API将实现ASP.NET身份验证。所有三个应用程序都将调用Web API的登录方法以获取认证令牌。

问题:

我的问题是如何使ASP.NET MVC 服务器端身份验证工作(与Web API同步,因此我不必单独登录ASP.NET MVC),而同时AngularJS会发出调用以获取HTML模板/视图、JavaScript文件或其他资源。我查阅了许多关于AngularJS的文章和博客,但仍无法找到符合我的要求的安全模型。

可能的解决方案:

是否将登录调用直接发给ASP.NET MVC应用程序而不是Web API会是一个好主意呢?然后,ASP.NET MVC应用程序将调用Web API进行登录,并在身份验证后将认证令牌保存在会话中,再创建一个FormsAuthentication cookie,并在cookie数据中保存加密的认证令牌。此外,在HTML某处设置ng-init中的auth token,以便在AngularJS范围内拥有该令牌。现在,当AngularJS尝试调用ASP.NET MVC应用程序以获取HTML时,通过将cookie解密后的数据与会话中的认证数据进行匹配来验证/授权用户。此外,AngularJS将为所有后续调用Web API方法的数据操作直接发送header中的auth token

3个回答

9

我用一个非常简单的解决方案解决了这个问题。我只需要在WebApiConfig的Register方法中确保有以下两行代码:

config.SuppressDefaultHostAuthentication();
config.Filters.Add(new HostAuthenticationFilter(OAuthDefaults.AuthenticationType));

这就完成了。现在我的MVC控制器会寻找会话cookie以进行授权,而我的Web API控制器会查找每个请求的标头中的auth token。此外,Web API会在响应登录/身份验证请求时发送一个token(JSON)和会话cookie本身,例如http:\\www.mydomain.com\token
因此,现在我将我的登录请求发送到Web API以获取令牌和会话cookie。会话cookie将自动随每个请求一起发送,因此我不必担心我的MVC控制器的授权。对于Web API调用,我会在每个请求的标头中发送auth token,因为Web API控制器并不关心会话cookie是否发送到请求中。

ng-init 用于在服务器端赋初值,例如使用 Razor;而我会调用 Web API 进行登录,并从该 API 返回一个带有 token 的 JSON。一旦您获得 JSON 中的 token,您可以将其存储在 Cookie 或浏览器内存中。 - Haider
@Haider,你是怎么发现这个的?是看了什么具体的书籍或者从一些实例经验中得到的启发吗? - Mikhail Orlov
@Mikhail,如果您在谈论答案,则不幸的是我没有在网上找到简单的描述/解释,尽管我的问题是如此,但它随处可见于Web API博客中。如果您问我最后的评论,那么ng-init用于将变量注入作用域,因此我通常使用它从服务器初始化数据到我的作用域中,例如使用razor。请参阅我的答案http://stackoverflow.com/a/23516445/1501074。当您处理Web API Ajax调用时,可以使用cookie或浏览器内存来存储令牌。 - Haider
我知道这个答案已经过了几个月了,但是是否有可能添加更多的代码呢?比如MVC Web应用程序如何从Web API服务中检索会话Cookie并使用它? - Connel
@Connel,在同一个Web API项目中添加你的MVC控制器。一旦你的登录HTML视图准备好了,编写javascript代码,在Web API“http:\www.mydomain.com\token”上进行ajax POST调用,使用用户名和密码。Web API将以json格式返回令牌以及会话cookie。你不需要对会话cookie做任何处理。现在,每当你调用MVC控制器时,这个会话cookie将自动发送。对于Web API控制器调用,你将在ajax请求的头部发送令牌。 - Haider
显示剩余3条评论

5

2
谢谢。这是我见过的最好的例子。解释得非常清楚。 - Maxwell Weru

1

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接