Question

我的5页网站上的所有页面都应使用Node.js服务器输出。

大部分页面内容都是静态的。在每个页面的底部，都有一些动态内容。

我的node.js代码目前如下：

var http = require('http'); 

http.createServer(function (request, response) {

    console.log('request starting...');

    response.writeHead(200, { 'Content-Type': 'text/html' });

    var html = '<!DOCTYPE html><html><head><title>My Title</title></head><body>';
    html += 'Some more static content';
    html += 'Some more static content';
    html += 'Some more static content';
    html += 'Some dynamic content';
    html += '</body></html>';

    response.end(html, 'utf-8');

}).listen(38316);

我确信这个例子有很多错误。请赐教！例如：

如何添加静态内容页面没有将它作为变量值存储在字符串中+ =多次？
在Node.js中构建小型网站的最佳做法是什么？所有网页都是静态和动态内容的混合？

Answer 1

就个人而言，我会使用具有更高级别构造的服务器。例如，看一下expressjs框架 - http://expressjs.com/

您将对此软件包感兴趣的构造包括：

真正的静态文件（资产等）：app.use（express.static（__ dirname +'/ public'））;
一种模仿语言，如玉，小胡子等：
- http://expressjs.com/en/guide/using-template-engines.html
- https://github.com/visionmedia/jade/
- 你想要查找'locals'和'partials'，以便在大部分静态内容中嵌入少量动态内容

例如在玉：

!!! 5
html(lang="en")
  head
    title= pageTitle
    script(type='text/javascript')
      if (foo) {
         bar()
      }
  body
    h1 Jade - node template engine
    #container
      - if (youAreUsingJade)
        p You are amazing
      - else
        p Get on it!

变为：

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Jade</title>
    <script type="text/javascript">
      if (foo) {
        bar()
      }
    </script>
  </head>
  <body>
    <h1>Jade - node template engine</h1>
    <div id="container">
      <p>You are amazing</p>
    </div>
  </body>
</html>

如果你喜欢的东西少一点 drastic 我会说看胡子或其他一些看起来更像普通酱汁的引擎。

Answer 2

替代方案，您可以使用jsDOM。这意味着你有一个可以在服务器上操作的DOM对象来添加动态内容，那么你只需将DOM作为HTML文件/字符串刷新

Answer 3

这些天答案并非如此直截了当。

如果您不需要由Google编制索引，请考虑使用socket.io和jQuery Templates等客户端模板制作单页应用程序。对于这种类型的体系结构，甚至有新兴的node.js框架，例如， socketstream。

如果您需要被Google编入索引，是否需要将动态内容编入索引？如是，考虑使用express和服务器端模板，例如ejs，jade或mustache。另一种（气馁的）方法可能是在服务器上从JSON生成XML并使用XSLT前端。

如果只需要索引静态内容，请考虑在服务器上使用express，但不要在服务器上生成任何动态HTML。相反，使用AJAX或socket.io将JSON格式的动态内容发送到客户端，并使用jQuery Templates等客户端模板进行渲染。

不要考虑服务器端DOM：DOM不能扩展复杂的布局，您将陷入选择器和DOM调用之中。甚至客户端开发人员也了解并实现了客户端模板。一种新的有前途的方法是weld库。它提供了两全其美的优点，但它还没有成熟用于生产（例如，不支持条件渲染等简单的事情）。

Answer 4

一个好方法是使用模板引擎。您可以将模板存储为单独的文件，模板引擎可以使内容动态化。我个人使用的是yajet（http://www.yajet.net/），这是为网络编写的，但在节点上运行良好，并且节点上有很多模板引擎。

Answer 5

我找到的最好的事情之一就是使用NodeJS，Express和Moustache ......

您可以像平常一样使用Mustache语法为变量{{name}}添加占位符来创建HTML页面...

当用户点击您的网站时，表示将slu will路由到正确的模板... NodeJS获取文件... NodeJS从数据库获取数据集... 通过服务器上的Mustache运行它... 将完成的页面发送给客户端......

这是我在博客上写的缩小版本。它很简单，但这个想法非常合理。我用它在我的网站上快速部署页面。

http://devcrapshoot.com/javascript/nodejs-expressjs-and-mustachejs-template-engine

我走这条路是因为我不想学习所有额外的语法来编写我已经知道的语言（html）。它更有意义，并且更多地遵循真正的MVC模式。

Answer 6

首先只从服务器向客户端提供静态HTML文件。然后使用类似AJAX / server.io的东西来提供动态内容。 IMO Jade在编写HTML代码时非常难看，而且最好使用模板引擎。

我做了一些谷歌并找到了这个家伙的一些代码，如果你正在为PoC /学习做这件事，这很好。

var server = require('./server'); 
var controller = require("./controller"); 
var urlResponseHandlers = require("./urlResponseHandlers");   

var handle = {};   
handle["/"] = urlResponseHandlers.fetch; 
handle["/fetch"] = urlResponseHandlers.fetch; 
handle["/save"] = urlResponseHandlers.save;   
server.start(controller.dispatch, handle);

以下是如何显示处理URL的逻辑 -

var staticHandler = require('./staticHandler');

function dispatch(handler, pathname, req, res) {
  console.log("About to dispatch a request for " + pathname);
  var content = "Hey " + pathname;
  if (typeof handler[pathname] === 'function') {
      content += handler[pathname](req);
      res.writeHead(200, {
          'Content-Type': 'text/html'
      });
      res.write(content);
      res.end();
  } else {
      console.log("No request handler found for " + pathname);
      staticHandler.handleStatic(pathname, res);
  }

}

以下是静态文件的处理方式 -

function handleStatic(pageUrl, response) {
    var filename = path.join(process.cwd(), pageUrl);
    path.exists(filename, function (exists) {
        if (!exists) {
            console.log("not exists: " + filename);
            response.writeHead(404, {
                'Content-Type': 'text/html'
            });
            response.write('404 Not Found\n');
            response.end();
            return;
        }
        //Do not send Content type, browser will pick it up. 
        response.writeHead(200);
        var fileStream = fs.createReadStream(filename);
        fileStream.on('end', function () {
            response.end();
        });
        fileStream.pipe(response);
        return;
    });
}
exports.handleStatic = handleStatic;

我喜欢这个主意。所有代码都是从this link复制的！

Answer 7

一个解决方案已经找到了这个，没有使用任何其他模块和/或其他脚本是将调用脚本变成一个模块并将其包含在函数require()中。
With this solution I can use javascript which ever way I want
我要做的是对nodejs脚本进行ajax调用（www.example.com/path/script.js）
script.js需要像exports.functionName=function(){...}的模块一样构建之后将其包含在您的网络服务器功能require(pathToTheScript).functionName(res,req)中您还需要通过执行res.end（）;

来结束functionName（res，req）中的响应。

如何使用Node.js构建静态和动态内容混合的页面？

7 个答案: