具有使用AngularJS并连接到ASP.NET Web API 2的login屏幕的SPA示例？
我想创build一个新的AngularJS，Web API单页面应用程序。 有没有人有任何示例，显示如何设置一个用户login屏幕连接到一个简单的login（无需谷歌/ Facebooklogin等），使用ASP.NET身份，无需用户注册的WEB API控制器。
另外我怎样才能处理显示一个新的视图，一旦login已完成。 我想要的是有一个解决scheme，不显示在浏览器的URL路由。 因此，例如，我希望能够从login视图和其他一些不同的视图切换，而不必从www.abc.com更改url。
换句话说，我想避免显示www.abc.com/screen2
任何意见将不胜感激。
所以，我没有试图find一个例子，而是创build了一个例子（链接在底部）。 为了解释这个function是如何工作的，我想要做一些事情：
-
新的ASP.NET身份系统提供了一个OAuth 2.0承载令牌实现，可以与通过HTTP使用Web API资源的客户端一起使用。 由于authentication不存储在会话cookie中，因此服务器不负责维护authentication状态。 副作用是消费者必须pipe理对服务器进行身份validation并pipe理返回的令牌。 这是微软在VS 2013提供的SPA模板中使用的系统。
-
AngularJS不做任何关于authentication的假设，所以由你来决定如何进行authentication。
-
AngularJS提供
$http服务来查询远程的基于HTTP的服务，以及build立在$http之上的$http$resource。 使用上面的带有承载令牌实现的Authorization头，您可以将两者结合起来，通过HTTP提供对服务器资源的authentication访问。 AngularJS允许你设置一个默认的Authorization头，它将在每个后续的HTTP事务中使用。
考虑到这一点，我完成这项工作的方式是创build一个用户服务，该服务处理Web API服务器和SPA之间的所有authentication详细信息，包括设置HTTP Authorization标头。 根据用户的身份validation状态，您可以隐藏某些UI元素以防止导航。 但是，如果您还将状态定义为需要身份validation作为状态的resolve对象的属性，则在$stateChangeError事件上设置的观察器将捕获错误并将用户redirect到login表单。 通过正确的身份validation后，它会将用户redirect到他们正在尝试导航的状态。
为了防止浏览器会话之间的身份validation丢失（因为客户端负责维护身份validation令牌，并且该令牌保留在内存中），我还添加了用户将身份validation持久化到cookie的function。 所有这些对用户来说都是透明的。 对于他们来说，它实际上与传统的基于forms和会话的authentication相同。
我不知道为什么要防止用户看到路线，但我已经编码它。 我负责Sedushi的Plunker示例如何使用AngularUI路由器以有状态的方式导航而不使用URL。 不过，我不确定我个人可以推荐这个用于我自己写的任何应用程序。
完整的解决scheme（WebAPI和WebUI）可以在这里一步一步地获得 。
让我知道任何不清楚的具体部分，我会尽量使答案更清楚。
请参阅以下博客，了解由Marlabs团队开发的ASP.NET Web API 2和AngularJS的单页面应用程序（SPA）演示。
该应用程序是用以下技术构build的：
- ASP.NET Web API 2
- EF 6 Code First
- AutoMapper
- Autofac
- 语义UI
- AngularJS 1.1.5
该应用程序在https://github.com/MarlabsInc/webapi-angularjs-spa上的github上发布。;
@DavidAntaramian给了一个很好的例子。 但是，如果你想要一个简单的，你可以从微软看这个HOL 。 他们在github上的最新例子使用.NET Core，但是你可以从2015年10月开始下载。
