将Javascript从节点快递发送到angular度服务

我正在尝试为客户端和服务器共享的实用程序方法编写一个通用的JavaScript端点。

我已经阅读过，但我正在努力把握这些概念。

我在想，也许把它作为一个string发送和使用eval？ 我不确定最佳做法是什么。

到目前为止，我得到了：

需要脚本的客户端服务。

angular.module('passionForgeApp').service('Utils', function () { //TODO Load these from the server side utlity module. } 

节点工具导出

 'use strict'; var Utility = function(){}; Utility.isASCII = function (str) { return /^[\x00-\x7F]*$/.test(str); }; Utility.isAlphaNumeric = function(str) { var code, i, len; for (i = 0, len = str.length; i < len; i++) { code = str.charCodeAt(i); if (!(code > 47 && code < 58) && // numeric (0-9) !(code > 64 && code < 91) && // upper alpha (AZ) !(code > 96 && code < 123)) { // lower alpha (az) return false; } } return true; }; module.exports = Utility; 

Node Express端点
这是我迷路的地方。

 //TODO Bad path. var utility = require('./../../components/utility'); // Gets a list of Commonjss exports.utility = function(req, res) { //send utility???? //Stuck here, sends {} to browser. res.json(utility); }; 

编辑

根据要求，发布browserify脚本。

这是由我可以在networking日志中看到的浏览器正在加载。

 (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){ 'use strict'; var Utility = function(){}; Utility.isASCII = function (str) { return /^[\x00-\xFF]*$/.test(str); }; Utility.isAlphaNumeric = function(str) { var code, i, len; for (i = 0, len = str.length; i < len; i++) { code = str.charCodeAt(i); if (!(code > 47 && code < 58) && // numeric (0-9) !(code > 64 && code < 91) && // upper alpha (AZ) !(code > 96 && code < 123)) { // lower alpha (az) return false; } } return true; }; module.exports = Utility; },{}]},{},[1]); 

我的问题是，我不知道如何使用它。

在我的控制器我试过， console.log(Utility); 然后我试着要求（'Utility'）。

没什么，未定义。 ： – /

编辑

将共享服务器端代码捆绑到客户端

Answer 1

如果这是你的文件夹结构

 / root / client - client.js / server - server.js / shared - utility.js 

在你的服务器（node.js）中，你需要这样的文件

 var server = require('server.js'); var utility = require('utility.js'); 

在你的浏览器中，你需要这样的文件

 <script src="client.js" type="text/javascript"> 

Node.js与浏览器有不同的模块系统。 主要的是RequireJS和CommonJS（节点的require() ），它们不兼容。

Browserify是一个将CommonJS或RequireJS模块转换为浏览器兼容（否则不是）的实用程序。 换句话说，它将通过文件（recursion地）“捆绑”所有需要的文件（），并将它们全部捆绑到单个文件中，供浏览器使用。

因此，如果您希望能够在node.js和浏览器中使用相同的文件，您可以根据需要，使用require（）来编写它（node.js样式）。

 // File utility.js var a = require('lodash') var b = require('myotherlib') module.exports.a = function(a){ } //etc. 

您可以在节点中使用它

 var utility = require('utility.js'); 

然后，你使用它的browserify工具。

 browserify utility.js -o utility-bundled.js 

那么，你可以在你的浏览器中使用它！

 <script src="utility-bundled.js" type="text/javascript"/> <script src="angular.js" type="text/javascript"/> <script src="controllers.js" type="text/javascript"/> <script src="app.js" type="text/javascript"> 

Browserify“browserifies”模块在浏览器中可用，否则它们不是。

– 编辑1

这将使您的实用程序库在“全球”。 但是，如果你想用这个语法来“导入”它：

 angular.module('passionForgeApp').service('Utils', function () { //TODO Load these from the server side utlity module. } 

你可以设置ocLazyLoad 。 这是一个非常好的库，用于定义延迟加载的外部文件。

“懒加载”它，这意味着它只会下载图书馆，当你明确要求它。

如果你正在使用这种方法，你可以删除

 <script src="utility-bundled.js" type="text/javascript"/> 

从你的index.html。 你必须设置ocLazyLoad

 angular.module('app', ['oc.lazyLoad']).config(['$ocLazyLoadProvider', function($ocLazyLoadProvider) { $ocLazyLoadProvider.config({ modules : [{ name : 'Utility', files : ['utility-bundled.js'] }] }); }]); 

然后你可以在需要它的模块中以懒惰的方式使用它

 angular.module('MyController', ['$ocLazyLoad', function(ocLazyLoad){ ocLazyLoad.load('Utility'); }] 

Answer 2

国际海事组织并不一定那么辛苦。 如果您在前端使用browserify或bundler，则可以这样做。 开始build立可能是一件痛苦的事情，但这是值得的。

项目结构

 /client main.js /components /utility utility.module.js /server controller.js /utilities <- put your code that is shared between server/client here Utility.js 

客户端/组件/效用/ utility.module.js

 module.exports = angular .module("app.utility") .factory("Utility", require(__dirname + "/../../utilities/Utility.js"); 

公用事业/ Utility.js

 module.exports = { toASCII: function() { //do stuff in angular and express } }; 

client / main.js（你需要在这里要求你所有的组件，这是你的browserify入口点）

 require("angular") .module("app" [ "app.utility" ]); require( <% path to utility.module.js %>); 

server / controller.js（你可以像预期的那样使用你的模块）

 var util = require( <% path to Utility.js %>); util.toASCII(); //do something 

Answer 3

另一种方法是在节点中编写实用程序模块，并使用browserify使其在节点或浏览器上运行。

Browserify将在您的文件的开始处添加代码，以检查是否存在module.exports对象或窗口对象。 然后它将确保当代码运行require语句，并且module.exports工作。

通过浏览代码，您可以在浏览器中使用实用程序function，将它们包含在您的html脚本标记中。

这应该比使用eval（）更安全。

更新

我做了一个例子。 我添加了下划线和时刻的要求，只是为了显示require语句的工作。 你不需要他们。

创build一个名为myUtility.js的文件并添加它

 var _ = require('underscore'); var moment = require('moment'); function now (format) { var time; var dFormat = 'YYYY-MM-DD hh:mm:ss a'; format = format || dFormat; try { time = 'TIME:\t' + moment().format(format); }catch (err) { time = 'TIME:\t' + moment().format(dFormat); }finally{ return time; } } function isAlphaNumeric(str) { var code, i, len; return _.every(str, function (letter, i) { code = str.charCodeAt(i); console.log('code: ' + code); if (!(code > 47 && code < 58) && // numeric (0-9) !(code > 64 && code < 91) && // upper alpha (AZ) !(code > 96 && code < 123)) { // lower alpha (az) return false; } }); } var myutil = { now: now, isAlphaNumeric: isAlphaNumeric, }; module.exports = myutil; 

运行这些命令：

 npm install browserify npm install underscore npm install moment browserify myUtility.js --s myutil -o myutil.js 

上面的browserify命令使myutil.js。 将此添加到您的index.html

 <script src="/path/to/myutil.js"></script> 

将其添加到您的控制器中并login到您的页面并检查控制台输出：

 console.log(myutil) var isAlphaNumeric = myutil.isAlphaNumeric; console.log('try cat: ' + isAlphaNumeric('cat')); console.log('try 123cat123: ' + isAlphaNumeric('123cat123')); console.log('try ca?t: ' + isAlphaNumeric('ca?t')); 

输出结果显示你现在在浏览器中使用你的函数，并导出模块，并在文件中要求语句。

另外ascii代码似乎需要调整。 我相信你想检查这个字母是否在||的任何范围内 代替 ＆＆。

 TIME: 2015-12-18 05:13:00 pm code: 99 try cat: false code: 49 try 123cat123: false code: 99 try ca?t: false 

当我浏览你的function，并将其添加到index.html，我在控制台中得到了不正确的答案。 更改字符逻辑修复它，以便如果代码不在任何组中它不会返回true：

 if ( (code > 47 && code < 58) || // numeric (0-9) false to true (code > 64 && code < 91) || // upper alpha (AZ) false to true (code > 96 && code < 123) // lower alpha (az) ) { return true; }