动态node.js内容

Question

我目前正在构建一个运行node.js 0.4.12和快速框架

的小型音乐测验

目前，我的快速设置非常基本，只提供基本网址

app.get('/', function(req, res){
res.render('index.jade');
});

我实现了一个小导航，它使用一个非常大的div，一个隐藏的溢出和一个内部div，内容根据你点击的导航标题调整其左值。

我也有一个新闻部分，当你点击它时会运行一个mongodb查询（内容通过socket.io传递）

当然这根本不是搜索引擎友好的，我的新闻根本就不会被发现并且每次运行查询都不需要新闻。 所以我需要一些存储新闻信息的方式，只有在发布新评论或添加新消息时才更新...

创建工作链接也很繁琐，目前我是通过javascript使用document.location.href.replace ...

另外一个问题是，如果我继续将每个内容放在一个页面上，我担心网站会变得太大而且加载时间太长......

所以，我如何保持页面的感觉（当前是一个无所不在的播放器，除非你离开页面，它永远不会停止），同时还能正确地为搜索引擎提供服务并保持页面加载时间较短？

Answer 1

如果我走在正确的轨道上，请告诉我，因为我不能完全理解您的问题，但是，我将如何完成您尝试做的事情：＆lt; < / p>

如果你正在寻找SEO的好处，有两种方法可以做到这一点。

在一个页面上加载来自服务器的所有内容，然后使用CSS和Javascript在加载内容后操作内容...

或

以传统方式设置页面（每个导航标签链接到一个新的整页），然后使用Javascript根据需要通过AJAX加载您的内容。

在这两种情况下，Google都可以抓取您的网页/网站结构并获得所需的一切，您仍然可以使用JS为用户分层交互。无论你最终做什么，SEO规则通常会把它视为我不需要JS来加载你的所有内容。

听起来你已经涵盖了第一个场景，但是我不会在链接中使用JS，而是使用id将它们作为标准的HTML锚链接。

如果您对第二种情况感兴趣，我建议这样做：

首先，接近导航，好像它不需要javascript才能正常工作。这意味着每个导航元素都链接到一个单独的页面（每个页面都需要一个单独的路由）。

如果您使用Jade渲染模板，我会使用其继承功能来管理您的标记。基本上，您已将所有html放入layout.jade，并且在您用于页面内容的大型div中，您需要使用默认内容创建block内。您为每个nav元素设置的路径将调用扩展index.jade的不同模板，并将特定于页面的内容写入您创建的block。

以下是一个例子：

app.get('/', function(req, res){
  res.render('index.jade');
});

app.get('/section1', function(req, res){
  res.render('section1.jade');
});

app.get('/section2', function(req, res){
  res.render('section2.jade');
});

这确保了每次访问http://yoursite.com/section1时，整个页面都会呈现（页眉，页脚和全部），但您不必在每个模板中复制页眉和页脚代码。它只存在于index.jade中，并由其他特定于部分的模板扩展。

在设置新闻Feed时，除非它将实时新闻更新推送到客户端，否则我会放弃socket.io设置，而是在页面加载时从数据库加载。抓取页面加载时从DB返回的任何内容，并通过局部变量将其传递给您的jade模板。例如：

app.get('/news', function(req, res){
  res.render('news', {
    newsArticles: newsArticles
  });
});

最后，当你像标准网站那样工作时（传统的http页面加载与javascript加载），然后在你的javascript上进行分层，将页面转换为通过AJAX加载内容的页面。我使用jQuery来做这件事，它的工作非常精彩。编写一些jQuery代码，将click事件附加到每个导航项。此点击事件会从您链接中的href获取网址，然后将其传递给jQuery＆＃39;加载＆＃39;方法，然后用你刚刚通过ajax加载的页面中的标记替换主内容区域中的内容。