如何在 AngularJS 客户端和 Node.js 服务器之间重用代码 [关闭]答案

【问题标题】：How to re-use code between AngularJS client and Node.js server [closed]如何在 AngularJS 客户端和 Node.js 服务器之间重用代码 [关闭]
【发布时间】：2014-05-10 18:05:00
【问题描述】：

在 AngularJS 客户端和 Node.js 服务器之间重用/共享代码的最佳实践是什么？

我实现了一个 AngularJS 应用程序。现在我需要实现一个 RESTful-server 为客户端提供数据。一些客户端角度服务可以在服务器上重用，例如第三方 RESTful 客户端到 Facebook/Google/Twitter，它们密集使用角度依赖注入并依赖于 $http、$q 和许多其他服务。

理想情况下，由于我真的很喜欢 AngularJS 中包含的依赖注入框架，我会发现拥有一种基于 AngularJS 的服务器框架非常好。一个服务器框架，包括依赖注入框架和所有与 UI 无关的角度服务，并添加所需的服务器端功能，如路由和身份验证。但不幸的是，我没有找到任何解决方案。（请告诉我这样的框架是否存在！）

那么，为了至少在客户端和服务器之间启用代码重用，还有什么替代方案？特别是启用代码重用取决于 $http、$q 和 Angular 框架和 Angular 第三方（如 angular-cache）中包含的其他 AngularJS 服务。

【问题讨论】：

非常有趣的问题。我认为共享模型和一些业务逻辑是一个非常有趣的想法。例如，共享模式、验证和服务可能会变得很棒。你也应该看看node-di。它是一个深受 AngularJS 启发的依赖注入框架。

标签： javascript node.js angularjs express code-reuse

【解决方案1】：

在这里使用RequireJS 是有意义的。

不要像这样在 Angular 中定义模型/服务：

(function (angular) {
  "use strict";
  angular.module('myModule').factory('MyModel', function (Deps) {
    var Model = function () {
      // do things here
    };
    return Model;
  });
}(window.angular));

您可以这样将其拆分为 2 个文件：

model.js：

(function (define) {
  "use strict";
  define([], function () {
    var factoryConstructor = function (deps) {
      var Model = function () {
        // do things here
      };
      return Model;
    };
    return factoryConstructor;
  });
}(window.define));

whatever.js

(function (define, angular) {
  "use strict";
  define(['Model'], function (Model) {
    angular.module("myModule").factory("myModel", Model);
  });
}(window.define, window.angular));

查看此Videos 以获得有关如何实现此功能的一个很好的示例，该视频中还有repository。

【讨论】：

【解决方案2】：

在非浏览器环境中使用 Angular

Ben Clinkinbeard 将角度分布准备为 commonJS 模块 (HERE)，可以在非浏览器环境中运行：

AngularJS 使用 jsdom 编译并作为 CommonJS 模块提供。用于在不依赖浏览器的情况下测试 AngularJS 代码。

如果您想更加挑剔，您可能应该等待 angular 2.0

在客户端和服务器端之间共享代码

再一次……本·克林金比德。在 THIS TALK 中，他描述了如何在 Angular 项目中使用 browserify。这种方法的一个很酷的特性是您可以将您的函数/对象声明为不与角度耦合的单独实体；因此它们也可以在不同的上下文中重复使用。

一个例子：

app.js

var app = angular.module('someModule',[]);
...
app.factory('someService', require('./some/path.js'));
...

./some/path.js

module.exports = function(dep1, dep2){
  ...
  return {
     ...
  }
}
module.exports.$inject['dep1', 'dep2']; // for minification;

【讨论】：

嗨，有点跑题了，但我正在做一些类似于 Ben 在演讲中提到的事情。我真的很喜欢分离实体并使它们模块化的概念。但是，我不知道你对这个概念玩了多少，但我很难让我的测试运行。每次我运行 mocha 测试时，我都会得到Argument 'SomeController' is not a function, got undefined http://errors.angularjs.org/1.2.21/ng/areq?p0=SomeController&p1=not%20a%20function%2C%20got%20undefined。如果你想四处看看here，我已经添加了 sn-p。
它似乎不知道我的控制器。另外，顺便说一句，曾经是 Ben 的软件包的 angular 现在已成为 angular 的官方仓库。因此，如果您执行npm i angular，它将改为为您提供 angular 的浏览器版本 :(。但您始终可以将 "angular": "git://github.com/bclinkinbeard/angular" 放入您的 package.json 以从 github 获取。

【解决方案3】：

Angular 1.x 是一个非常独立的框架。有一个计划将功能分开，但这将在版本 2 中出现。所以这很简单，只需为浏览器和 node.js 提供不同的 $httpBackend 实现。

我创建了一个简单的演示如何使用 CommonJS share code between node.js and browser。这可用于共享验证、模型等。

【讨论】：