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

问题描述

| 我的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中构建一个小型站点（其中所有页面都是静态和动态内容之间的混合）的最佳实践方法是什么？

解决方法

就个人而言，我将使用具有更高级别构造的服务器。例如，看一下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>

如果您喜欢一些不太激烈的东西，我会说看一下胡须或其他看上去更像常规酱html的引擎。 ,或者，您可以只使用jsDOM。这意味着您有一个DOM对象，可以在服务器上对其进行操作以添加动态内容，然后可以将DOM刷新为HTML文件/字符串 ,这些天，答案不是那么简单。如果您不需要Google索引，请考虑使用socket.io和客户端模板（例如ѭ4making）制作单页应用程序。甚至有针对这种架构的新兴node.js框架，例如socketstream。如果需要Google索引，是否需要对动态内容进行索引？如是，考虑使用express和服务器端模板，例如ejs，jade或mustache。另一种（禁止使用的）方法可能是从服务器上的JSON生成XML并使用XSLT前端。如果只需要对静态内容进行索引，请考虑在服务器上使用ѭ6，但不要在服务器上生成任何动态HTML。而是使用AJAX或socket.io将JSON格式的动态内容发送给客户端，并使用客户端模板（例如jQuery Templates）进行呈现。不要考虑服务器端DOM：DOM无法为复杂的布局扩展，您会陷入大量选择器和DOM调用的困境。甚至客户端开发人员也理解这一点，并实现了客户端模板。一种新的有前途的方法是ѭ12库。它兼具两全其美的优点，但尚未成熟可用于生产环境（例如，尚不支持条件渲染之类的简单操作）。 ,一种好的方法是使用模板引擎。您可以将模板存储为单独的文件，并且模板引擎可以使内容动态化。我个人使用的yajet（http://www.yajet.net/）是为Web编写的，但可以与node一起使用，并且在npm上有许多用于node的模板引擎。 ,我发现的最好的事情之一就是使用NodeJS，Express和Mustache ... 您可以像通常使用Mustache语法为变量{{name}}的占位符一样创建HTML页面... 当用户访问您的网站时，请将子弹表达给正确的模板... NodeJS获取文件... NodeJS从数据库获取数据集... 通过服务器上的Moustache运行它... 将完成的页面发送给客户端... 这是我在博客上写的缩小版本。很简单，但想法很合理。我用它来在我的网站上快速部署页面。 http://devcrapshoot.com/javascript/nodejs-expressjs-and-mustachejs-template-engine 我走这条路是因为我不想学习所有额外的语法来编写我已经知道的语言（html）。它更有意义，并且遵循更多的真实MVC模式。 ,首先仅将静态HTML文件从服务器传递到客户端。然后使用AJAX / server.io之类的东西来提供动态内容。 IMO Jade很难编写HTML代码，并且最好使用模板引擎。我做了一些Google，并找到了这个人的一些代码，如果您要进行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);

这是显示处理网址的逻辑的方式-

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;

我喜欢这个主意。从此链接复制的所有代码！。 ,已经找到一种不使用任何其他模块和/或其他脚本的解决方案，就是将调用脚本编入模块，并将其包含在函数“ 16”中。通过此解决方案，我可以使用JavaScript，无论哪种方式我要做的是对Node.js脚本进行Ajax调用（www.example.com/path/script.js）必须使用would17ѭ像一个模块一样来构建script.js 之后，将其包含在您的网络服务器功能中require(pathToTheScript).functionName(res,req) 您还需要通过执行res.end（）;来结束functionName（res，req）中的响应。

使用使用使用内容内容动态动态构建构建构建混合混合静态页面页面

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

问题描述

解决方法

相关问答