如何build立一个完整的后端可扩展的SPA
在过去的几个星期里，我一直在努力与Angular，Node，TDD，Heroku，Amazon S3等合作。试图更好地了解如何构build一个完整的可扩展的SPA，以及一个可靠的后端，使用grunt，bower，天堂尽pipe我明白通过噶玛testing是如何进行的，但是这应该是我的下一步了。
有一件事是肯定的： 它是一个信息
关于使用所有这些技术的问题/理由。
首先，我玩了
- Angular App https://github.com/angular-app/angular-app
- NG锅炉板https://github.com/joshdmiller/ng-boilerplate
读了好几十个post等
我发现NG Boilerplate是最合理的结构（就我理解这些事情而言）。
作为一个演示项目（从一个非常小的东西演化而来），我想要制作一个单页的CRUD应用程序，使用：
- NodeJS作为后端
- 表示为一个Web应用程序框架
- NG锅炉作为客户
- 该应用程序部署到Heroku
- MongoDB for DB
- Amazon S3用于dynamic存储
现在我想使用Angular-Apps（ https://github.com/angular-app/angular-app ）服务器作为我的NGBoilerplate kickstarter的后端
我想知道如何：
- 从我看到的客户端直接连接到MongoDB？
- angular度客户如何来回expression？
- 我读了一篇有趣的文章http://www.espeo.pl/2012/02/26/authentication-in-angularjs-application相关的authentication工作。
长话短说，没有我问了一大堆的问题，有人请详细描述这样一个应用程序的工作stream程？ 获取会话，login，访问编辑内容，将高速路由绑定到angular度路由（例如X路由可以由pipe理员访问）等##
我头上有一个很大的模糊:)。
在过去的几个月里，我对这些问题和问题进行了很多研究，得出了以下结论：
为了达到我的目的，我需要一个几乎完全依赖于Angular的应用程序，而不需要单独的后端，而现在的后端应该来自Angular。
为什么？ 因为我想把所有的鸡蛋都放在一个篮子里，我不想在很多不同的部分上configuration大量的东西。
作为我的项目的基础，我最终使用了ng-boilerplate，作为样板:)，并对开发过程，Grunt任务等进行了一些更改，这是每个人都可以根据每个特定项目找出的。
那么我要谈谈的主要问题是，对于在Angular中创build的真正的后端，我们需要安全的路由和安全的持久化方法，即数据库。
对于应用程序，我利用了ng-boilerplate的模块化和依赖意识的结构，我认为这是完美的angular度的应用程序。
无论如何，我会把事情从头到尾（最终产品明智的，如上所述的build设环境，这取决于你，但ng-boilerplate是真棒），在这里我们去。
- 在上层，我们有实际的Angular应用程序，只是我们想要的方式
- 服务器容器是一个NodeJS服务器，具有快速和其他模块，可以在不同的浏览器和设备上部署PARTIAL路由（在我的应用程序中，我制作了HTML5路由，通过express，.htaccess等设置，只要有部分URL应该redirect到索引，Angular将读取请求的path，并将zapp到那个位置）
- 在我的情况下，整个事情在Heroku上运行，在一个Node.JS应用程序上，如果你愿意的话，你可以安装其他的东西。
现在，持久性，有authentication和安全性，而不是依靠后端的，我使用的是firebase（ https://www.firebase.com/ ），有一些伟大的教程，在那里帮助你去和真实在Angular APP中持久化，在login时使用路由，在login时访问数据库中的自定义表格/对象等。这是真正的交易。
如果您不希望依赖OAuth的可能网站（Facebook，github，persona或twitter）login，并希望自定义电子邮件和地址，则可以直接使用Firebase进行操作，创build帐户并将其删除。
FIREBASEangular度后端。
因此，就像他们在网站上所说的，Firebase是一个function强大的API，可以实时存储和同步数据。
我不知道如何解决这个问题，所以我要创build一个Firebase数据库。 一旦我们创build它，在后端我们有几个选项，其中之一就是安全性。
{ "rules": { ".read": true, ".write": "auth != null" } }
我们可以保护每个用户的基础上，不同的规则，如果login或没有，我们也有规则inheritance等，请认真阅读文档，这是一个很好的阅读。
现在，要使这些规则生效，我们需要启用Firebase简单login并从Facebook，Twitter，Github，angular色，电子邮件和密码以及匿名中select所需的login方法。
对于一个真正的应用程序，我们需要写信息到数据库也作为匿名（用户会话等），也logging（上述任一选项）来存储和读取信息。
我想要快速简单的方法，做了一个Facebook身份validation，阅读那里的文档，我做了一个快速的Facebook应用程序，并在Facebook上的应用程序的设置我把Firebase的后端https：//www.dropbox。 COM / S / xcd4b8tty1nlbm5 /截图％202014-01-22％2013.51.26.png
这给出了一个临时链接来login到Facebook，并有权访问“表”，否则locking，如果规则是auth !=null 。
现在，到angular落的后端。
Firebase为我们提供了一个库，可以放入我们的应用程序，以及一个用于Angular的SimpleLogin库，一个名为AngularFire的工厂服务。
在我的情况下，我使用连接到我的数据库的使用方法使本地firebaseService：
angular.module('firebaseService', ['firebase']) .service('firebaseService', function ($firebase, $rootScope) { //Input data in Firebase var URL = "https://glowing-fire-xxxx.firebaseio.com"; var tellFirebase = function(ID, JSON) { users = $firebase(new Firebase(URL + '/' + ID)); users.details = JSON; users.$save('details'); }; return { addUser: function(ID, JSON) { tellFirebase(ID, JSON); if ($rootScope.debugStatus === true) { console.log('Firebase Service .addUSer Called'); } }, getUser: function(ID) { if ($rootScope.debugStatus === true) { console.log('Firebase Service .getUser Called'); } } }; })
从这里我们做我们的读/写，在控制器的页面我有这样的：
值得注意的是，我有一个中间件服务（storageManagement），可以在Firebase和MongoDB之间切换，以避免混淆。
.controller( 'SomeCtrl', function SomeController( $scope, storageManagement, $firebase, $firebaseSimpleLogin ) { /*=========================== * ==== FIREBASE LOGIN * ===========================*/ var URL = "https://glowing-fire-XXXXX.firebaseio.com"; var users = new Firebase(URL); $scope.auth = $firebaseSimpleLogin(users, function(error, user){}); if ($scope.auth.user == null) { //$scope.auth.$login('facebook'); } console.log($scope.auth); //$scope.auth.$logout('facebook'); $scope.doLogin = function() { console.log($scope.facebookemail); console.log($scope.facebookpassword); $scope.auth.$login('facebook'); $scope.$on("$firebaseSimpleLogin:login", function(evt, user) { storageManagement.runFirebase(); }); /* example of logging in while asking access to permissions like email, user_list, friends_list etc. * auth.$login('facebook', { rememberMe: true, scope: 'email,user_likes' });*/ }; $scope.doLogout = function() { $scope.auth.$logout(); }; });
我将$ firebase服务添加到我的控制器，并$ firebaseSimpleLogin之一。
这里暴露的范围两个button，login/注销，从Facebookpopup的OAuth窗口，电子邮件/密码设置，你不需要经过这个我想，要充分了解请阅读完整的文档在firebase。
所以，一旦我们login ，我们就可以访问规则中描述的表格，如果我们select电子邮件/密码，实际上即使是Facebook或其他方法，我们也可以为特定的IDENTITIES分配一定的规则，所以你可以有一个ADMIN表保存页面加载时读取的设置，以应用您想要的任何内容。
现在，通过路由，我们可以检查$ scope.auth状态，如果我们放在$ rootScope中，并检查路由时的状态，如果状态检查，我们到达该路由，并获得填充否则，即使有人攻击它的路由，它不会看到任何东西，因为没有权限读取该表的未经授权/错误的电子邮件用户。
这是松散的基础上这篇文章， http://www.gn-newsletter.com/posts/back-end-with-firebase.html …我很难改变从那家伙写在那里的心态，但是，之后从Firebase阅读文档（并设置中间件，介意您）整整一天，我就明白了它的工作原理。
与数据库的连接就像一个BIG对象一样暴露，你可以在其中进行任何你想要的操作。
这不是最完整的解释，但它应该让你很好地做出一些令人敬畏的事情：D
我遇到的这个最好的例子叫做angular-app。
这是非常全面的，并满足您的所有需求。 它由一本梦幻书“用AngularJS掌握Web应用程序开发”的作者之一编写。
https://github.com/angular-app/angular-app
从github回购：
AngularJS CRUD应用程序演示目的
这个想法是演示如何使用AngularJS编写一个典型的，非平凡的CRUD应用程序。 为了在最有利的环境中展示AngularJS，我们开始着手使用SCRUM方法编写一个简化的项目pipe理工具来支持团队。 示例应用程序试图展示最佳实践：文件夹结构，使用模块，testing，与REST后端通信，组织导航，解决安全问题（authentication/授权）。
我们在使用和支持邮件列表上的AngularJS方面学到了很多东西，并希望分享我们的经验。
堆
持久性存储：在MongoLab上托pipe的MongoDB后端：Node.js客户端上的Awesome AngularJS基于Twitter的引导构build的CSS
这是一个完整的项目，其构build系统专注于AngularJS应用程序，并与AngularJS社区中常用的其他工具紧密集成：
由使用Jasmine语法testing编写的Grunt.jstesting所支持的testing由Karma Test Runner（与Grunt.js构build集成）构build，支持JS，CSS和AngularJS模板微缩Twitter的引导与LESS模板处理集成到构buildTravis-CI集成