javascript - 使用 Angular 设置 Express

Question

我可以很容易地使用 ASP/Visual Studio 在我的 Web 应用程序中设置 Angular，但我想进入 Node 世界，更具体地说是 Express。我并没有真正理解 Express 的基本路由处理程序，它将支持 Angular 拥有的范例。

比如建立一个Express文件，有上百万个例子，但几乎所有的例子都用Jade做模板，我反对Jade的语法，不想用它。

到目前为止，我的 Express 服务器有这个(我已经评论了一些关于我到目前为止所做的决定的问题):

var express     = require('express'),
    path        = require('path');

var app = express();

var env = process.env.NODE_ENV || 'development';

// 1) Is this really necessary if I'm going to utilize Angular routing for views?
app.set('views', path.join(__dirname, '/app/views'));
app.use(express.static(__dirname + '/public'));

// 2) I'm assuming this is the desired pattern for utilizing Angular.
//  A catch-all handler that serves up an html file, which will then
//  hand off the rest of the routing to Angular?
app.get('*', function(req, res) {
  res.sendFile(path.join(__dirname + '/public/index.html'));
});

const PORT = 3000;
app.listen(PORT);
console.log('Listening on port: ' + PORT);

我的问题是:

• 是app.set('views', ...)通过 Express 在 Angular 应用程序中是必需的，还是它真的适用于 Jade/EJS 模板工作流程？如果它对 Angular 有用，我应该将它指向什么路径？我的 Angular View ？或者只是用作所有 Angular View 容器的静态 html 文件？

• 我假设 app.use(express.static(...))仍然需要确保 Express 可以提供公共(public)静态资源，例如 css/javascript。

• 是一个 app.get('*', ...) { res.sendFile('path/to/index.html') }路由处理程序提供一个 html 文件的公认模式，其中将包含所有必要的 Angular 用法？

• 对于 Angular，整个应用程序只有一个 html 文件，然后仅使用 Angular 的路由和 Controller / View 来处理其余部分是否正常？

Answer 1

Is app.set('views', ...) necessary in an Angular app through Express or is it really intended for a Jade/EJS templating workflow? If it's useful to Angular, what path should I point it to? My Angular views? Or just the static html file that will serve as the container to all angular views?

如果你需要在服务器端渲染一个 View 然后发送给客户端，你需要这个。否则(在你的情况下)没有。您可以只将文件发送给用户或根据用户发送给服务器的参数生成用户特定的输出。它可以是任何东西，HTML 文件、json 或只是简单的文本。

I'm assuming app.use(express.static(...)) is still needed for ensuring Express can serve up public static resources, like css/javascript.

你是对的。如果您还需要提供静态内容，最好的方法是使用 express.static，但是您可以自己捕获请求并提供内容。

Is an app.get('*', ...) { res.sendFile('path/to/index.html') } route handler the accepted pattern for serving up one html file, which will contain all necessary Angular usage?

如果对于先前路由未捕获的每个其他请求，您需要发送完全相同的文件，是的，没问题。

请记住，如果您需要将其他 HTML 文件作为模板提供，并且它们与您在 express.static 中指向的目录不在同一目录中，则客户端无法访问 html 文件。我稍后会讨论它。

但是，我认为定义所有路由而不是仅仅放置一个 * 来捕获它们是一个很好的做法。最好至少定义一个模式，以后维护代码会更容易。

For Angular, is it normal to only have one html file for the entirety of your application, and then just use Angular's routing and controllers/views to handle the rest?

取决于您的应用。在大多数情况下是的。

我已经完成了几个大的 Angular 项目，我只有一个实际服务于主要 html 文件的路由，以及一个服务于静态文件(图片、js、css)的路由。我还有一个指向 templates 目录的路由，该目录应该作为静态内容。这些是 AngularJS 需要使用的模板。

对于 Angular 应用程序和服务器之间的通信，您可能还需要其他路由。您可以创建 RESTful API 端点来为客户端和服务器创建通信层。

我通常在服务器代码中包含这两行，以将所有模板保存在同一个文件夹中。它使管理和定义工作流程变得更加容易:

app.use(express.static(path.join(__dirname, 'public')));
app.use('/templates', express.static(path.join(__dirname, 'templates')));

对于服务器和客户端之间的通信:

app.post('/login', function (req, res) {
// deal with login information ...
    res.send({
        done: true,
        errors: []
    });
});

app.post('/search', function (req, res) {
    // do the search ...
    res.send({
        done: true,
        results: []
    });
});

请记住，如果您在应用中的某个时刻使用了 *，您之后定义的其他路由将永远不会捕获该请求。

和

I'm against Jade's syntax and have no desire to utilize it.

是的，我也是!但也有其他选择，我个人更喜欢 ejs。如果您正在使用 express-generator，您只需传递 -e 开关，它将创建与 ejs 兼容的所有内容。

$ express -e

另外，看看 here .