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

我的問題是：

• 是通過Express在Angular應用程序中是app.set('views', ...)還是真的用於Jade / EJS模板工作流程？ 如果它對Angular有用，我應該指向哪條路徑？ 我的Angular觀點？ 或者只是靜態html文件，它將作為所有角度視圖的容器？

• 我假設仍然需要app.use(express.static(...))來確保Express可以提供公共靜態資源，比如css / javascript。

• 是一個app.get('*', ...) { res.sendFile('path/to/index.html') }路由處理程序，用於提供一個html文件的接受模式，它將包含所有必要的Angular用法？

• 對於Angular，只有一個html文件用於整個應用程序是正常的，然后只使用Angular的路由和控制器/視圖來處理其余的？

Answer 1

是通過Express在Angular應用程序中是app.set('views', ...)還是真的用於Jade / EJS模板工作流程？ 如果它對Angular有用，我應該指向哪條路徑？ 我的Angular觀點？ 或者只是靜態html文件，它將作為所有角度視圖的容器？

如果需要在服務器端呈現視圖然后將其發送到客戶端，則需要這樣做。 否則（在你的情況下）沒有。 您只需將文件發送給用戶，或根據用戶發送到服務器的參數生成特定於用戶的輸出。 它可以是任何東西，HTML文件，json或只是簡單的文本。

我假設仍然需要app.use(express.static(...))來確保Express可以提供公共靜態資源，比如css / javascript。

你是對的。 如果您還需要提供靜態內容，最好的方法是使用express.static ，但是您可以自己捕獲請求並提供內容。

是一個app.get('*', ...) { res.sendFile('path/to/index.html') }路由處理程序，用於提供一個html文件的接受模式，它將包含所有必要的Angular用法？

如果對於之前路由沒有捕獲的每個其他請求，您需要發送完全相同的文件，是的，它沒關系。

請記住，如果您需要將其他HTML文件作為模板提供，並且它們與您在express.static指向的目錄不在同一目錄中，則客戶端無法訪問html文件。 我會稍微討論一下。

但是，我認為定義所有路線是一個好習慣，而不僅僅是設置一個*來捕捉所有路線。 最好至少定義一個模式，稍后維護代碼會更容易。

對於Angular，只為整個應用程序提供一個html文件是正常的，然后只使用Angular的路由和控制器/視圖來處理其余的？

取決於您的申請。 在大多數情況下是的。

我已經完成了幾個大角度項目，我只有一個實際服務於主要html文件的路由，以及一個提供靜態文件的路徑（圖片，js，css）。 我還有一個指向templates目錄的路由，該目錄應作為靜態內容提供。 這些是AngularJS需要使用的模板。

對於角度應用程序和服務器之間的通信，您可能還需要其他路由。 您可以創建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: []
    });
});

請記住，如果您在應用中的某個時刻使用* ，那么您之后定義的其他路由將永遠不會捕獲請求。

和

我反對Jade的語法並且不想使用它。

我也是！ 但是還有其他選擇，我個人更喜歡ejs 。 如果您使用express-generator您可以只傳遞-e開關，它將創建與ejs兼容的所有內容。

$ express -e

另外，看看這里 。