javascript - setup - mean stack

Cómo volver a usar el código entre el cliente AngularJS y el servidor Node.js

Question

¿Cuáles son las mejores prácticas para reutilizar / compartir código entre un cliente AngularJS y un servidor Node.js?

Implementé una aplicación AngularJS. Ahora necesito implementar un servidor RESTful que proporcione datos al cliente. Algunos servicios angulares del lado del cliente podrían reutilizarse en el servidor, como por ejemplo los clientes relajados de terceros a Facebook / Google / Twitter, que usan intensamente la inyección de dependencia angular y que dependen de $http , $q y muchos otros servicios.

Idealmente, como realmente me gusta el framework de inyección de dependencias incluido en AngularJS, me gustaría tener un tipo de framework basado en AngularJS. Un marco de servidor que incluye el marco de inyección de dependencia y todos los servicios angulares que no están relacionados con la interfaz de usuario, y agrega la funcionalidad necesaria del lado del servidor, como el enrutamiento y la autenticación. Pero desafortunadamente, no encontré ninguna solución yendo de esa manera. (¡Por favor dígame si existe un marco así!)

Entonces, ¿cuál sería una alternativa para, al menos, habilitar la reutilización del código entre el cliente y el servidor? Particularmente, permite la reutilización de código para el código en función de $http , $q y otros servicios AngularJS incluidos en el marco angular y terceros angular-cache (como angular-cache ).

Answer 1

Usar RequireJS para esto tiene sentido aquí.

En lugar de definir su modelo / servicio dentro de Angular de esta manera:

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

Lo harías de esta manera dividiéndolo en 2 archivos:

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));

Consulte estos videos para ver un buen ejemplo sobre cómo implementar esto, también existe el repositorio de ese video.

Answer 2

Angular 1.x es un marco bastante autónomo. Existe un plan para separar las funcionalidades, pero eso vendrá en la versión 2. Así que esto sería simple ya que solo proporciona una implementación diferente de $ httpBackend para el navegador y node.js.

He creado una demostración simple de cómo compartir código entre node.js y el navegador con CommonJS. Esto se puede usar para compartir validación, modelos, etc.

Answer 3

Usar angular en un entorno sin navegador

Ben Clinkinbeard preparó la distribución angular como un módulo commonJS ( HERE ), que puede ejecutarse en un entorno que no sea de navegador:

AngularJS compilado con jsdom y provisto como un módulo CommonJS. Destinado a probar código AngularJS sin depender de un navegador.

Si quieres ser más selecto, probablemente deberías esperar angular 2.0

Compartir código entre el lado del cliente y el lado del servidor

Y de nuevo ... Ben Clinkinbeard. En THIS TALK describe cómo hacer uso de browserify en un proyecto angular. Una buena característica de este enfoque es que puede declarar sus funciones / objetos como entidades separadas que de todos modos no están acopladas con angular; para que puedan ser reutilizados en diferentes contextos también.

Un ejemplo de esto:

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;