AngularJS 应用程序可以使用哪些 .NET 服务器端技术？答案

【问题标题】：What .NET server-side technology can be used with an AngularJS app?AngularJS 应用程序可以使用哪些 .NET 服务器端技术？
【发布时间】：2015-07-06 23:43:55
【问题描述】：

我正在尝试使用AngularJS 创建我的第一个 Web 应用程序。我习惯使用 ASP.NET MVC 4，所以我想我会在服务器端使用它，在客户端使用 Angular。但是在看了视频和研究之后，似乎将这两者混为一谈是错误的。原因之一是路由：Angular 以自己的方式路由，ASP.NET MVC 也是如此。

那么，对于熟悉 ASP.NET MVC 的人来说，前端的 Angular 可以使用哪些服务器端 Web 技术？我即将在 Visual Studio 2013 中创建一个新项目，这些是我的选择：

注意：我不是在寻找关于为什么一种选择会比另一种更好的辩论；我只是希望听到有哪些可能性。我可以从那里调查。

注意 2：我也可以使用 Angular seed template，我也可以，但这并不能回答在服务器端使用什么的问题。

编辑在这种情况下使用 ASP.NET Web API 可能有意义吗？见https://stackoverflow.com/a/21098169/279516。

【问题讨论】：

我的公司正在实施一个大规模的 MVC/AngularJS 项目，因为这是我老板出于客户的意愿提出的要求。我不知道将这两者混合在一起是多么错误。我们没有任何问题。所有 URL 都是在 _Layout 页面中使用 @Url.Action() 生成的，以确保对路由的更改将在客户端中镜像。我想看看这些链接。
你在使用 Angular 的路由吗？如果是这样，那就意味着你没有使用 MVC 的控制器，对吧？
您能否详细说明您在 MVC 中遇到的路由问题？通常人们对 MVC 路由的问题是灵活/宽容而不是过于僵化......
我从来没有遇到过 MVC 路由问题。但我以前也从未使用过 Angular。 Angular 有自己的路由方式。
我会选择 ASP.NET。只需使用 AngularJS SPA 模板作为起点：visualstudiogallery.msdn.microsoft.com/…

标签： c# asp.net asp.net-mvc angularjs

【解决方案1】：

在我看来，您似乎正在尝试制作单页应用程序。我理解您对路由的困惑，所以我将解释我们是如何做到的。

我们有一个 ASP.NET MVC5 项目，它还托管 ASP.NET Web API 2。我们所有的 MVC5 路由都由单个控制器中的单个操作处理：

routes.MapRoute("CatchAll", "{*url}",
                    new { controller = "Home", action = "Index" }
                        );

这个动作返回一个视图，这个视图是我们需要让 AngularJS 应用程序工作的基本 HTML。该 HTML 在头部包含所需的 CSS 和 JavaScript 文件（框架和应用程序逻辑，如控制器、指令、服务等），在正文中包含一些基本 HTML，如页眉、页脚和 ng-view 元素，其中每个路由的视图你映射的被渲染。

现在，通过 ASP.NET Web API，我们实现了 AngularJS 应用程序使用的 REST Web 服务。这些 Web 服务返回 AngularJS 很好理解的 JSON 对象，您将在 JavaScript 应用程序中使用它们而不会产生任何摩擦。

总而言之，您在浏览器中点击的任何链接，例如 /Home/Index、/Home/Friends、/Account/Settings 等，服务器将始终返回相同的 HTML，AngularJS 将读取 URL 并执行您在应用程序中配置的相应控制器和相应视图。

了解更多关于单页应用程序：http://en.wikipedia.org/wiki/Single-page_application

阅读更多关于使用 AngularJS 的单页应用程序：http://scotch.io/tutorials/javascript/single-page-apps-with-angularjs-routing-and-templating 2

要了解有关 REST 服务的更多信息：http://www.vinaysahni.com/best-practices-for-a-pragmatic-restful-api

这不是故事的结局。我说过，您点击的任何路由，服务器将始终返回相同的 HTML。那为什么要使用 ASP.NET MVC5？这个基本的 HTML 可以是静态文件，对吧？

好吧，这个概念在搜索引擎优化方面是行不通的。搜索引擎机器人不执行 JavaScript，因此他们希望通过在您的路线（链接）上的一次点击来提供他们需要的所有内容。此外，Facebook 不执行 JavaScript，但还需要特定于用户尝试共享的页面的 HTML。

所以，我们所做的就是在服务器端创建与 AngularJS 上映射的路由相同的路由，并为每个操作添加一个过滤器。此过滤器检查请求是否来自浏览器，它为每个操作返回相同的 HTML。如果它是来自 Google 或 Bing 机器人或 Facebook 爬虫的请求，则过滤器允许执行该操作，并且该操作为该路由返回适当的 HTML。此 HTML 非常基本，结构非常好，Google、Bind 和 Facebook 都可以理解，并且不包含任何 CSS 或 JavaScript。

【讨论】：

因此，如果不关心搜索引擎优化，那么最好的方法是前端使用 Angular，后端使用 ASP.NET Web API？
是的，它们是绝配。我们使用它们没有任何麻烦。

【解决方案2】：

这样做并没有错。开箱即用，Web API 可以交付 Angular JS 使用的 JSON 数据。

原版 ASP.NET MVC 项目为您提供了基本的 Web 应用程序和身份验证。然后可以调整各个视图以利用 Angular 提供的单页功能。

.NET 路由可以像任何其他 MVC 站点一样使用，其中一些路由服务于 SPA 页面的基础，允许您在整个 Web 应用程序中开发多个更小的 SPA。然后，您可以使用 Angular 的路由在您的迷你 SPA 的不同视图之间切换。

【讨论】：

在这种情况下，您使用哪种技术进行路由？

【解决方案3】：

Angular.js 是一个客户端框架，可以与任何后端系统一起使用，因为它独立于平台。您可以编写普通的 html + WebApi 或将 Angular 代码同时放入任何 Web 表单或 MVC 视图，并使用 json 成功使用后端服务器（例如，但实际上可以是任何），这样您就可以选择您更喜欢/更了解的内容。

顺便说一句，关于路由或任何其他东西，它只是解决问题的一个来源，但只有当视频中的人说这是一个很酷的功能时，你才需要使用它。只需使用可以帮助您解决问题的东西，其余的留到其他时间。

【讨论】：