从 node.js 服务器运行角度
Posted
技术标签:
【中文标题】从 node.js 服务器运行角度【英文标题】：Running angular from node.js server 【发布时间】：2015-10-23 02:45:50 【问题描述】：我有以下文件 -
1) 索引.html
2) app.js（这里是角度控制器）
3) routes.js（我正在尝试从这里加载 index.html - 监听 localhost:3000）
4) 索引.css
5) node_modules 文件夹
routes.js：
var express = require('express'),
app = express(),
server = require('http').createServer(app),
io = require('socket.io').listen(server);
server.listen(3000);
app.use("/node_modules", express.static('node_modules'));
app.use("/public", express.static('public'));
app.get('/', function(req, res)
res.sendFile(__dirname + '/index.html');
);
io.sockets.on('connection', function(socket)
socket.on('send message', function(data)
io.sockets.emit('new message', data);
);
);
当我通过从文件资源管理器中单击正常打开 index.html 文件时，它可以正常打开。
但是，当我运行 routes.js 以获取相同的 index.html 文件时，我得到了没有角度效果的原始 HTML。 这是为什么呢？
谢谢！
编辑：
我现在可以从 localhost:3000/public/ 访问我的 index.css 和 app.js。
我在routes.js 中使用了app.use("/public", express.static('public'));。
但现在我的页面中只能包含css，但看起来仍然不包含 angular。我看不到标签。请看上面带有标签的index.html 文件的截图。
如何包含角度？它不是包含在 HTML 本身中的吗？
index.html -
<html>
...
...
<link href="node_modules/bootstrap-3.3.5-dist/css/bootstrap.min.css" rel="stylesheet">
<link href="public/index.css" rel="stylesheet">
<body>
...
...
<script src="node_modules/angular/angular.js"></script>
<script src="public/ui-bootstrap-tpls-0.13.1.js"></script>
<script src="node_modules/socket.io/node_modules/socket.io-client/socket.io.js"></script>
<script src="public/app.js"></script>
</body>
</html>
编辑： 我通过包含解决了它
app.use("/node_modules", express.static('node_modules'));
在我的 routes.js 文件中。所以现在 express 也使用该文件夹，因此该文件夹中的 angular 文件用于为我的 index.html 文件提供服务。
现在，运行我的localhost:3000/ 会给我预期的结果。谢谢！
【问题讨论】：
node_modules 是 nodejs 保存其模块的文件夹，angular.js 是一个 Web 应用程序框架，它不应该以任何方式放在 node_modules 中，对于 socker.io 客户端库也是如此，你应该采取它脱离了node_modules。同样在其他链接中重新公开，路径与我的示例中的磁盘上的文件夹不同，您应该将文件放在磁盘上的 public/javascript 文件夹中，但以 @teamnorge 感谢您的回复。我现在可以访问我的 js 和 css 文件。但是角度似乎不起作用。请看我编辑的问题。我正在使用并引用我下载的 angularJS 的本地副本，而不是链接到 CDN url。那是错的吗？纠正我！ 拥有 angularjs 的本地副本没问题，只需将其放入适当的目录（在 public/javascript 中的某个位置），正如我上面提到的 node_modules 不是保存它的适当位置。 我解决了@teamnorge。只是按照相同的逻辑来提供静态文件。我还包括它以通过 app.use("/node_modules", express.static('node_modules')); 为我的“node_modules”服务。现在，该页面正在使用 Angular。感谢“teamnorge”坚持我的问题。我很乐意接受您的回答，请在您的回答中包含此内容 - app.use("/node_modules", express.static('node_modules'));。 对不起，我不会包含它，因为我不建议有一个到 node_modules 文件夹的路由，最好把你的 web 相关库从它里面取出并放在另一个文件夹中，在 expressjs 中也设置为静态. 【参考方案1】：您的静态文件 (js/css) 似乎无法通过 expressjs 访问，您可以在浏览器控制台中查看是否为 404？
顺便问一下，您是在expressjs 中添加了app.js 以静态形式存储的目录，还是与index.html 位于同一目录中？
类似：
app.use('/js',express.static(path.join(__dirname, 'public/javascripts')));
或者，您可以将路由添加到您的app.js：
app.get('/js/app.js', function(req, res)
res.sendFile(__dirname + '/app.js');
);
但不推荐，只是为了测试。
【讨论】：
app.js 与 index.html 位于同一目录中。我正在尝试按照您的建议包含 js 和 css 文件。 抱歉，我无法从 express 中加载这些文件，并且添加 app.js 也不起作用。 app.js 的控制器是空的。因此，添加或不添加它们应该没有太大区别。我在我的 HTML 中链接了 css 和 js 文件，所以我认为这不是问题。如果我错了，请纠正我。 那么，你看到css文件了吗？为简单起见，您可以创建一个文件夹 - public，将所有内容放在那里并指定 app.use(express.static(__dirname + '/public'));那么您的所有静态文件都必须可以从 / 访问 我按照你的建议做了。看起来我也无法访问我的公用文件夹。有什么帮助吗？我仍然得到相同的 HTML 页面，没有 CSS 和 Angular。【参考方案2】：您正在运行您的节点服务器。
所以，您提到了静态文件（如 js、css）的路径。
为您的 app.js 定义路径，其中包括您的控制器。
假设您的app.js 位于根目录下的公用文件夹中，
然后在你的route.js中这样定义
app.use(express.static('public'));
【讨论】：
正如@teamnorge 所建议的那样。我使用了 app.use(express.static(__dirname + '/public'));将我的文件包含在 /public 文件夹中，但无济于事。我也无法从本地主机访问我的公用文件夹。请看我编辑的问题。 请告诉我您的 index.html 文件，其中包含您的脚本。 请看我的编辑。我在链接这些文件的地方包含了 sn-p。以上是关于从 node.js 服务器运行角度的主要内容，如果未能解决你的问题，请参考以下文章